回显问题修复

vue.config.js

@@ -1,40 +1,25 @@
-'use strict'
+const path = require('path');
-const path = require('path')
+const CompressionPlugin = require('compression-webpack-plugin');
 
 function resolve(dir) {
-    return path.join(__dirname, dir)
+    return path.join(__dirname, dir);
 }
 
-const CompressionPlugin = require('compression-webpack-plugin')
+const name = process.env.VUE_APP_TITLE || '水运工程设计施工AR应用平台';
+const baseUrl = 'http://127.0.0.1:58080';
+const port = process.env.port || process.env.npm_config_port || 80;
 
-const name = process.env.VUE_APP_TITLE || '水运工程设计施工AR应用平台' // 网页标题
-
-const baseUrl = 'http://127.0.0.1:58080' // 后端接口
-
-const port = process.env.port || process.env.npm_config_port || 80 // 端口
-
-// vue.config.js 配置说明
-//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
-// 这里只列一部分，具体配置参考文档
 module.exports = {
-    // 部署生产环境和开发环境下的URL。
-    // 默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上
-    // 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.ruoyi.vip/admin/，则设置 baseUrl 为 /admin/。
     publicPath: process.env.NODE_ENV === 'production' ? '/' : '/',
-    // 在npm run build 或 yarn build 时 ，生成文件的目录名称（要和baseUrl的生产环境路径一致）（默认dist）
     outputDir: 'dist',
-    // 用于放置生成的静态资源 (js、css、img、fonts) 的；（项目打包之后，静态资源会放在这个文件夹下）
     assetsDir: 'static',
-    // 如果你不需要生产环境的 source map，可以将其设置为 false 以加速生产环境构建。
     productionSourceMap: false,
     transpileDependencies: ['quill'],
-    // webpack-dev-server 相关配置
     devServer: {
         host: '0.0.0.0',
         port: port,
         open: true,
         proxy: {
-            // detail: https://cli.vuejs.org/config/#devserver-proxy
             [process.env.VUE_APP_BASE_API]: {
                 target: baseUrl,
                 changeOrigin: true,
@@ -42,7 +27,6 @@ module.exports = {
                     ['^' + process.env.VUE_APP_BASE_API]: '',
                 },
             },
-            // springdoc proxy
             '^/v3/api-docs/(.*)': {
                 target: baseUrl,
                 changeOrigin: true,
@@ -65,23 +49,29 @@ module.exports = {
             },
         },
         plugins: [
-            // http://doc.ruoyi.vip/ruoyi-vue/other/faq.html#使用gzip解压缩静态文件
             new CompressionPlugin({
-                cache: false, // 不启用文件缓存
+                cache: false,
-                test: /\.(js|css|html|jpe?g|png|gif|svg)?$/i, // 压缩文件格式
+                test: /\.(js|css|html|jpe?g|png|gif|svg)?$/i,
-                filename: '[path][base].gz[query]', // 压缩后的文件名
+                filename: '[path][base].gz[query]',
-                algorithm: 'gzip', // 使用gzip压缩
+                algorithm: 'gzip',
-                minRatio: 0.8, // 压缩比例，小于 80% 的文件不会被压缩
+                minRatio: 0.8,
-                deleteOriginalAssets: false, // 压缩后删除原文件
+                deleteOriginalAssets: false,
             }),
         ],
     },
     chainWebpack(config) {
-        config.plugins.delete('preload') // TODO: need test
+        config.module
-        config.plugins.delete('prefetch') // TODO: need test
+            .rule('mjs')
+            .test(/\.mjs$/)
+            .include.add(/node_modules/)
+            .end()
+            .type('javascript/auto');
 
-        // set svg-sprite-loader
+        // 原有 svg-sprite 处理
-        config.module.rule('svg').exclude.add(resolve('src/assets/icons')).end()
+        config.plugins.delete('preload');
+        config.plugins.delete('prefetch');
+
+        config.module.rule('svg').exclude.add(resolve('src/assets/icons')).end();
         config.module
             .rule('icons')
             .test(/\.svg$/)
@@ -91,20 +81,19 @@ module.exports = {
             .loader('svg-sprite-loader')
             .options({
                 symbolId: 'icon-[name]',
-            })
+            });
-            .end()
 
+        // 生产环境优化配置
         config.when(process.env.NODE_ENV !== 'development', (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()
+                .end();
 
             config.optimization.splitChunks({
                 chunks: 'all',
@@ -113,23 +102,23 @@ module.exports = {
                         name: 'chunk-libs',
                         test: /[\\/]node_modules[\\/]/,
                         priority: 10,
-                        chunks: 'initial', // only package third parties that are initially dependent
+                        chunks: 'initial',
                     },
                     elementUI: {
-                        name: 'chunk-elementUI', // split elementUI into a single package
+                        name: 'chunk-elementUI',
-                        test: /[\\/]node_modules[\\/]_?element-ui(.*)/, // in order to adapt to cnpm
+                        test: /[\\/]node_modules[\\/]_?element-ui(.*)/,
-                        priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
+                        priority: 20,
                     },
                     commons: {
                         name: 'chunk-commons',
-                        test: resolve('src/components'), // can customize your rules
+                        test: resolve('src/components'),
-                        minChunks: 3, //  minimum common number
+                        minChunks: 3,
                         priority: 5,
                         reuseExistingChunk: true,
                     },
                 },
-            })
+            });
-            config.optimization.runtimeChunk('single')
+            config.optimization.runtimeChunk('single');
-        })
+        });
     },
-}
+};