第一,先安装插件
npm install @vitejs/plugin-legacy
第二,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'
]
})
],
结束
小问题: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,
},
},
},