移除了index.html中的script脚本，通过插件在非dev环境进行注入script

config/web/webpack.config.js

@@ -21,6 +21,7 @@ const modules = require('./modules');
 const getClientEnvironment = require('./env');
 const ModuleNotFoundPlugin = require('react-dev-utils/ModuleNotFoundPlugin');
 const ForkTsCheckerWebpackPlugin = require('./../../plugins/ForkTsCheckerWarningWebpackPlugin');
+const InjectScriptWebpackPlugin = require('./../../plugins/InjectScriptWebpackPlugin');
 const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 const CompressionWebpackPlugin = require('compression-webpack-plugin');
@@ -774,6 +775,8 @@ module.exports = function (webpackEnv) {
             ].filter(Boolean),
         },
         plugins: [
+            // 非dev环境注入script
+            !isEnvDevelopment && new InjectScriptWebpackPlugin(),
             !isEnvDevelopment &&
                 new CompressionWebpackPlugin({
                     filename: '[path][base].gz', //压缩后的文件名
@@ -1011,7 +1014,8 @@ module.exports = function (webpackEnv) {
         // Turn off performance processing because we utilize
         // our own hints via the FileSizeReporter
         performance: false,
-        externals: {
+        // 在非开发模式下，排除相关模块，以使用CDN加载
+        externals: !isEnvDevelopment ? {
             echarts: 'echarts',
             lodash: '_',
             react: 'React',
@@ -1019,6 +1023,6 @@ module.exports = function (webpackEnv) {
             '@wangeditor/editor': 'wangEditor',
             '@fingerprintjs/fingerprintjs': 'FingerprintJS',
             'bn.js': 'BN',
-        },
+        } : {},
     };
 };

plugins/InjectScriptWebpackPlugin.js

@@ -0,0 +1,56 @@
+'use strict';
+const fs = require('fs');
+const path = require('path');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+
+class InjectScriptWebpackPlugin {
+  constructor(options = {}) {
+    this.injectsDir = options.injectsDir || './injects';
+  }
+
+  apply(compiler) {
+    compiler.hooks.compilation.tap('InjectScriptWebpackPlugin', (compilation) => {
+      HtmlWebpackPlugin.getHooks(compilation).beforeEmit.tapAsync(
+        'InjectScriptWebpackPlugin',
+        (data, cb) => {
+          const injectScripts = this.getInjectScripts();
+          
+          if (injectScripts.length > 0) {
+            const scriptsToInject = injectScripts.map(script => 
+              `<script>${script}</script>`
+            ).join('\n');
+
+            // 在</body>标签前插入脚本
+            data.html = data.html.replace('</body>', `${scriptsToInject}</body>`);
+          }
+
+          cb(null, data);
+        }
+      );
+    });
+  }
+
+  getInjectScripts() {
+    const injectScripts = [];
+    // 使用 __dirname 获取当前文件的目录
+    const injectsPath = path.resolve(__dirname, this.injectsDir);
+    
+    if (fs.existsSync(injectsPath)) {
+      const files = fs.readdirSync(injectsPath);
+      
+      files.forEach(file => {
+        if (path.extname(file).toLowerCase() === '.js') {
+          const filePath = path.join(injectsPath, file);
+          const content = fs.readFileSync(filePath, 'utf-8');
+          injectScripts.push(content);
+        }
+      });
+    } else {
+      console.warn(`Injects directory not found: ${injectsPath}`);
+    }
+
+    return injectScripts;
+  }
+}
+
+module.exports = InjectScriptWebpackPlugin;

plugins/injects/version-check.js

@@ -0,0 +1,101 @@
+(function() {
+    var sys = {};
+    var ua = navigator.userAgent.toLowerCase();
+    var s;
+    (s = ua.match(/firefox\/([\d.]+)/))
+        ? (sys.firefox = s[1])
+        : (s = ua.match(/chrome\/([\d.]+)/))
+        ? (sys.chrome = s[1])
+        : (s = ua.match(/opera.([\d.]+)/))
+        ? (sys.opera = s[1])
+        : (s = ua.match(/rv:([\d.]+)/))
+        ? (sys.ie = s[1])
+        : (s = ua.match(/msie ([\d.]+)/))
+        ? (sys.ie = s[1])
+        : (s = ua.match(/version\/([\d.]+).*safari/))
+        ? (sys.safari = s[1])
+        : 0;
+    var browser = 'Unknown';
+    var tip = document.createElement('div');
+    var closeBtn = document.createElement('img');
+    var contentHTML =
+        '您当前使用的浏览器可能会出现界面显示异常或功能无法正常使用等问题，建议下载使用谷歌，火狐，edge等新版本浏览器。';
+    var handleClickClose = function (event) {
+        document.body.removeChild(tip);
+    };
+    var startAppend = function () {
+        document.body.appendChild(tip);
+        tip.appendChild(closeBtn);
+    };
+
+    // closeBtn.style.position = 'absolute';
+    // closeBtn.style.right = '20px';
+    // closeBtn.style.bottom = '7px';
+    // closeBtn.style.cursor = 'pointer';
+    // closeBtn.style.width = '15px';
+    // closeBtn.style.height = '15px';
+    // closeBtn.src = '../assets/images/icon-close.png';
+    // closeBtn.alt = '关闭';
+
+    // if (closeBtn.addEventListener) {
+    //     closeBtn.addEventListener('click', handleClickClose);
+    // } else {
+    //     // IE8 及以下
+    //     closeBtn.attachEvent('onclick', handleClickClose);
+    // }
+
+    tip.style.position = 'relative';
+    tip.style.backgroundColor = 'yellow';
+    tip.style.color = 'red';
+    tip.style.position = 'fixed';
+    tip.style.top = 0;
+    tip.style.right = 0;
+    tip.style.left = 0;
+    tip.style.padding = '5px 20px';
+    tip.style.fontSize = '14px';
+
+    if (sys.ie) {
+        browser = 'IE';
+        tip.innerHTML = contentHTML;
+        startAppend();
+    }
+    if (sys.firefox) {
+        browser = 'Firefox';
+    }
+    if (sys.chrome) {
+        browser = 'Chrome';
+
+        var getChromeVersion = function () {
+            var arr = navigator.userAgent.split(' ');
+            var chromeVersion = '';
+            for (var i = 0; i < arr.length; i++) {
+                if (/chrome/i.test(arr[i])) chromeVersion = arr[i];
+            }
+            if (chromeVersion) {
+                return Number(
+                    chromeVersion.split('/')[1].split('.')[0]
+                );
+            } else {
+                return false;
+            }
+        };
+
+        if (getChromeVersion()) {
+            var version = getChromeVersion();
+            // 如果 360 极速浏览器并切换到极速模式低于86版本
+            if (version < 87) {
+                tip.innerHTML =
+                    '您当前使用的浏览器版本过低，使用可能会出现界面显示异常或功能无法正常使用等问题，建议下载使用谷歌，火狐，edge等新版本浏览器。';
+                startAppend();
+            }
+        }
+    }
+    if (sys.opera) {
+        browser = 'Opera';
+        tip.innerHTML = contentHTML;
+        startAppend();
+    }
+    if (sys.safari) {
+        browser = 'Safari';
+    }
+})();

template/web/public/index.html

@@ -110,109 +110,4 @@
       To begin the development, run `npm start` or `yarn start`.
       To create a production bundle, use `npm run build` or `yarn build`.
     --></body>
-
-    <script>
-        function getBrowserVersion() {
-            var sys = {};
-            var ua = navigator.userAgent.toLowerCase();
-            var s;
-            (s = ua.match(/firefox\/([\d.]+)/))
-                ? (sys.firefox = s[1])
-                : (s = ua.match(/chrome\/([\d.]+)/))
-                ? (sys.chrome = s[1])
-                : (s = ua.match(/opera.([\d.]+)/))
-                ? (sys.opera = s[1])
-                : (s = ua.match(/rv:([\d.]+)/))
-                ? (sys.ie = s[1])
-                : (s = ua.match(/msie ([\d.]+)/))
-                ? (sys.ie = s[1])
-                : (s = ua.match(/version\/([\d.]+).*safari/))
-                ? (sys.safari = s[1])
-                : 0;
-            var browser = 'Unknown';
-            var tip = document.createElement('div');
-            var closeBtn = document.createElement('img');
-            var contentHTML =
-                '您当前使用的浏览器可能会出现界面显示异常或功能无法正常使用等问题，建议下载使用谷歌，火狐，edge等新版本浏览器。';
-            var handleClickClose = function (event) {
-                document.body.removeChild(tip);
-            };
-            var startAppend = function () {
-                document.body.appendChild(tip);
-                tip.appendChild(closeBtn);
-            };
-
-            // closeBtn.style.position = 'absolute';
-            // closeBtn.style.right = '20px';
-            // closeBtn.style.bottom = '7px';
-            // closeBtn.style.cursor = 'pointer';
-            // closeBtn.style.width = '15px';
-            // closeBtn.style.height = '15px';
-            // closeBtn.src = '../assets/images/icon-close.png';
-            // closeBtn.alt = '关闭';
-
-            // if (closeBtn.addEventListener) {
-            //     closeBtn.addEventListener('click', handleClickClose);
-            // } else {
-            //     // IE8 及以下
-            //     closeBtn.attachEvent('onclick', handleClickClose);
-            // }
-
-            tip.style.position = 'relative';
-            tip.style.backgroundColor = 'yellow';
-            tip.style.color = 'red';
-            tip.style.position = 'fixed';
-            tip.style.top = 0;
-            tip.style.right = 0;
-            tip.style.left = 0;
-            tip.style.padding = '5px 20px';
-            tip.style.fontSize = '14px';
-
-            if (sys.ie) {
-                browser = 'IE';
-                tip.innerHTML = contentHTML;
-                startAppend();
-            }
-            if (sys.firefox) {
-                browser = 'Firefox';
-            }
-            if (sys.chrome) {
-                browser = 'Chrome';
-
-                var getChromeVersion = function () {
-                    var arr = navigator.userAgent.split(' ');
-                    var chromeVersion = '';
-                    for (var i = 0; i < arr.length; i++) {
-                        if (/chrome/i.test(arr[i])) chromeVersion = arr[i];
-                    }
-                    if (chromeVersion) {
-                        return Number(
-                            chromeVersion.split('/')[1].split('.')[0]
-                        );
-                    } else {
-                        return false;
-                    }
-                };
-
-                if (getChromeVersion()) {
-                    var version = getChromeVersion();
-                    // 如果 360 极速浏览器并切换到极速模式低于86版本
-                    if (version < 87) {
-                        tip.innerHTML =
-                            '您当前使用的浏览器版本过低，使用可能会出现界面显示异常或功能无法正常使用等问题，建议下载使用谷歌，火狐，edge等新版本浏览器。';
-                        startAppend();
-                    }
-                }
-            }
-            if (sys.opera) {
-                browser = 'Opera';
-                tip.innerHTML = contentHTML;
-                startAppend();
-            }
-            if (sys.safari) {
-                browser = 'Safari';
-            }
-        }
-        getBrowserVersion();
-    </script>
 </html>