vue3+vite4兼容低版本火狐浏览器45.0.2版本_火狐浏览器vue3+vite4 vuerouter typeerror:key.split(...)

第一，先安装插件

npm install @vitejs/plugin-legacy
1

第二，vite.config.js添加配置

plugins: [vue(),
      legacy({
        targets: ['firefox > 40','chrome >= 52'],
        additionalLegacyPolyfills: ['regenerator-runtime/runtime'],
        renderLegacyChunks: true,
        polyfills: [
          'es.symbol',
          'es.promise',
          'es.promise.finally',
          'es/map',
          'es/set',
          'es.array.filter',
          'es.array.for-each',
          'es.array.flat-map',
          'es.object.define-properties',
          'es.object.define-property',
          'es.object.get-own-property-descriptor',
          'es.object.get-own-property-descriptors',
          'es.object.keys',
          'es.object.to-string',
          'web.dom-collections.for-each',
          'esnext.global-this',
          'esnext.string.match-all'
        ]
      })
    ],
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

结束

小问题：build打包的时候看到一个警告，build.terserOptions is specified but build.minify is not set to use Terser. Note Vite now defaults to use esbuild for minification. If you still prefer Terser, set build.minify to “terser”. 意思是代码压缩，需要使用一下
安装插件

npm i terser -D --legacy-peer-deps

vite.config.js里面，把build项配置一下 minify: 'terser',即可

 build:{
      minify: 'terser',
      sourcemap: false, // 不生成 source map 
      outDir: 'dist',// 打包构建输出路径，默认 dist ，如果路径存在，构建之前会被删除
      assetsPublicPath: './',
      terserOptions: { 
        compress: { // 打包时清除 console 和 debug 相关代码
          drop_console: true,
          drop_debugger: true,
        },
      },
    },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16