feat:

wangdan-fit2cloud · Apr 25, 2023 · 71c1f24 · 71c1f24
1 parent 0b834fd
commit 71c1f24
Show file tree

Hide file tree

Showing 3 changed files with 78 additions and 50 deletions.
diff --git a/README.md b/README.md
@@ -115,6 +115,39 @@ rollupOptions: {
 
 ![image](src/assets/readme/4.png)
 
+也可以分不同的文件夹，打包之后每个模块一个文件夹
+
+```
+ build: {
+    rollupOptions: {
+      output: {
+          // 用于命名代码拆分时创建的共享块的输出命名
+        chunkFileNames: (chunkInfo) => {
+          const facadeModuleId = chunkInfo.facadeModuleId
+            ? chunkInfo.facadeModuleId.split('/')
+            : [];
+          const fileName =
+            facadeModuleId[facadeModuleId.length - 2] || '[name]';
+          return `js/${fileName}/[name].[hash].js`;
+        },
+        // 用于从入口点创建的块的打包输出格式
+        entryFileNames: `js/[name]-[hash].js`,
+        // assetFileNames 不设置 所有css和图片文件就默认在assets中
+        // assetFileNames: `assets/[ext]/[name]-[hash].[ext]`,
+        manualChunks(id: string) {
+          if (id.includes('node_modules')) {
+            return 'vendor'
+          }
+          // 一个模块只要一个文件，如果需要一个vue一个文件，以下代码可忽略
+          if (id.includes('/src/views/')) {
+            return id.toString().split('/src/views/')[1].split('/')[0]
+          }
+        }
+      }
+    }
+  }
+```
+
 
 ### 3、第三方代码分包后，文件过于琐碎，只单独提出个别大文件
 
@@ -144,10 +177,6 @@ rollupOptions: {
           if (id.includes('node_modules')) {
             if (id.includes('vue')) {
               return 'vue'
-            } else if (id.includes('element-plus')) {
-              return 'element-plus'
-            } else if (id.includes('fit2cloud-ui-plus')) {
-              return 'fit2cloud-ui-plus'
             } else if (id.includes('axios')) {
               return 'axios'
             }

diff --git a/stats.html b/stats.html
diff --git a/vite.config.ts b/vite.config.ts
@@ -27,51 +27,50 @@ export default defineConfig({
       '@': fileURLToPath(new URL('./src', import.meta.url))
     }
   },
-  // build: {
-  //   minify: 'terser',
-  //   emptyOutDir: true, //打包前先清空原有打包文件
-  //   //生产环境时移除console
-  //   terserOptions: {
-  //     compress: {
-  //       drop_console: true,
-  //       drop_debugger: true
-  //     }
-  //   },
-  //   rollupOptions: {
-  //     output: {
-  //       // 用于命名代码拆分时创建的共享块的输出命名
-  //       chunkFileNames: (chunkInfo) => {
-  //         const { name, isDynamicEntry } = chunkInfo
-  //         if (isDynamicEntry) {
-  //           return `js/views/${name}-[hash].js`
-  //         }
-  //         return `js/vendor/${name}-[hash].js`
-  //       },
-  //       // 用于从入口点创建的块的打包输出格式
-  //       entryFileNames: `js/[name]-[hash].js`,
-  //       // 用于输出静态资源的命名，打包后的目录中可能会出现png、jpg、svg、ttf、gif等目录。
-  //       // assetFileNames: `assets/[ext]/[name]-[hash].[ext]`,
-  //       manualChunks(id: string) {
-  //         // 根据不同模块
-  //         if (id.includes('/src/views/')) {
-  //           return id.toString().split('/src/views/')[1].split('/')[0]
-  //         }
-  //         if (id.includes('node_modules')) {
-  //           if (id.includes('vue')) {
-  //             return 'vue'
-  //           } else if (id.includes('element-plus')) {
-  //             return 'element-plus'
-  //           } else if (id.includes('fit2cloud-ui-plus')) {
-  //             return 'fit2cloud-ui-plus'
-  //           } else if (id.includes('axios')) {
-  //             return 'axios'
-  //           }
-  //           return 'vendor'
-  //         }
-  //       }
-  //     }
-  //   }
-  // },
+  build: {
+    minify: 'terser',
+    emptyOutDir: true, //打包前先清空原有打包文件
+    //生产环境时移除console
+    terserOptions: {
+      compress: {
+        drop_console: true,
+        drop_debugger: true
+      }
+    },
+    rollupOptions: {
+      output: {
+        // 用于命名代码拆分时创建的共享块的输出命名
+        chunkFileNames: (chunkInfo) => {
+          const facadeModuleId = chunkInfo.facadeModuleId
+            ? chunkInfo.facadeModuleId.split('/')
+            : [];
+          const fileName =
+            facadeModuleId[facadeModuleId.length - 2] || '[name]';
+          return `js/${fileName}/[name].[hash].js`;
+        },
+
+        entryFileNames: `js/[name]-[hash].js`,
+        // 用于输出静态资源的命名，打包后的目录中可能会出现png、jpg、svg、ttf、gif等目录。
+        // assetFileNames: `assets/[ext]/[name]-[hash].[ext]`,
+        // manualChunks(id: string) {
+        //   // 根据不同模块
+        //   if (id.includes('/src/views/')) {
+        //     return id.toString().split('/src/views/')[1].split('/')[0]
+        //   }
+        //   if (id.includes('node_modules')) {
+        //     if (id.includes('vue')) {
+        //       return 'vue'
+        //     } else if (id.includes('fit2cloud-ui-plus')) {
+        //       return 'fit2cloud-ui-plus'
+        //     } else if (id.includes('axios')) {
+        //       return 'axios'
+        //     }
+        //     return 'vendor'
+        //   }
+        // }
+      }
+    }
+  },
   server: {
   }
 })