zc

package-lock.json

@@ -8380,6 +8380,14 @@
         "ajv-keywords": "^3.5.2"
       }
     },
+    "script-ext-html-webpack-plugin": {
+      "version": "2.1.5",
+      "resolved": "https://registry.npmmirror.com/script-ext-html-webpack-plugin/-/script-ext-html-webpack-plugin-2.1.5.tgz",
+      "integrity": "sha512-nMjd5dtsnoB8dS+pVM9ZL4mC9O1uVtTxrDS99OGZsZxFbkZE6pw0HCMued/cncDrKivIShO9vwoyOTvsGqQHEQ==",
+      "requires": {
+        "debug": "^4.2.0"
+      }
+    },
     "scss-tokenizer": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/scss-tokenizer/-/scss-tokenizer-0.3.0.tgz",

package.json

@@ -17,6 +17,7 @@
     "jquery": "^3.6.0",
     "mqtt": "^4.2.8",
     "qs": "^6.11.0",
+    "script-ext-html-webpack-plugin": "^2.1.5",
     "swiper": "^4.3.3",
     "vue": "^3.2.13",
     "vue-router": "^4.1.4",

vue.config.js

@@ -14,38 +14,96 @@ module.exports = defineConfig({
     proxy: process.env.VUE_APP_ENV === 'production' ? 'https://www.aaa.com/' : 'https://gateway.bbb.com/'
 
   },
+  chainWebpack(config) {
+    config
+        .when(process.env.VUE_APP_ENV !== 'www.dlc.com',
+            config => {
+                config
+                    .plugin('ScriptExtHtmlWebpackPlugin')
+                    .after('html')
+                    .use('script-ext-html-webpack-plugin', [{
+                        // `runtime` must same as runtimeChunk name. default is `runtime`
+                        inline: /runtime\..*\.js$/
+                    }])
+                    .end()
+                config
+                    .optimization.splitChunks({
+                    chunks: 'all',
+                    cacheGroups: {
+                        libs: {
+                            name: 'chunk-libs',
+                            test: /[\\/]node_modules[\\/]/,
+                            priority: 10,
+                            chunks: 'initial'
+                        },
+                        elementUI: {
+                            name: 'chunk-elementUI',
+                            priority: 20,
+                            test: /[\\/]node_modules[\\/]_?element-plus(.*)/,
+                            chunks: 'initial'
+                        },
+                        echarts: {
+                            name: 'chunk-echarts',
+                            priority: 20,
+                            test: /[\\/]node_modules[\\/]_?echarts(.*)/,
+                        },
+                        flv: {
+                            name: 'chunk-flv',
+                            priority: 20,
+                            test: /[\\/]node_modules[\\/]_?flv(.*)/
+                        },
+                        jsJquery: {
+                            name: 'chunk-jquery',
+                            priority: 20,
+                            test: /[\\/]node_modules[\\/]_?jquery(.*)/
+                        },
+                        mqtt: {
+                            name: 'chunk-mqtt',
+                            priority: 20,
+                            test: /[\\/]node_modules[\\/]_?mqtt(.*)/
+                        },
+                        mqttPacket: {
+                            name: 'chunk-mqtt-packet',
+                            priority: 20,
+                            test: /[\\/]node_modules[\\/]_?mqtt-packet(.*)/
+                        },
+                    }
+                })
+            }
+        )
+    },
   //去掉console
-  configureWebpack: (config) => {
-    // 判断为生产模式下，因为开发模式我们是想保存console的
-    if (process.env.NODE_ENV === "production") {
-      config.optimization.minimizer.map((arg) => {
-        const option = arg.options.terserOptions.compress;
-        option.drop_console = true; // 打开开关
-        return arg;
-      });
-    }
-  },
-  configureWebpack: {
-    // 关闭 webpack 的性能提示
-    // performance: {
-    //   hints:false
-    // }
-
-    // //或者
-
-    // 警告 webpack 的性能提示
-    performance: {
-      hints: 'warning',
-      // 入口起点的最大体积
-      maxEntrypointSize: 50000000,
-      // 生成文件的最大体积
-      maxAssetSize: 30000000,
-      // 只给出 js 文件的性能提示
-      assetFilter: function (assetFilename) {
-        return assetFilename.endsWith('.js')
-      }
-    }
-  }
+  // configureWebpack: (config) => {
+  //   // 判断为生产模式下，因为开发模式我们是想保存console的
+  //   if (process.env.NODE_ENV === "production") {
+  //     config.optimization.minimizer.map((arg) => {
+  //       const option = arg.options.terserOptions.compress;
+  //       option.drop_console = true; // 打开开关
+  //       return arg;
+  //     });
+  //   }
+  // },
+  // configureWebpack: {
+  //   // 关闭 webpack 的性能提示
+  //   // performance: {
+  //   //   hints:false
+  //   // }
+  //
+  //   // //或者
+  //
+  //   // 警告 webpack 的性能提示
+  //   performance: {
+  //     hints: 'warning',
+  //     // 入口起点的最大体积
+  //     maxEntrypointSize: 50000000,
+  //     // 生成文件的最大体积
+  //     maxAssetSize: 30000000,
+  //     // 只给出 js 文件的性能提示
+  //     assetFilter: function (assetFilename) {
+  //       return assetFilename.endsWith('.js')
+  //     }
+  //   }
+  // }
 })