import { fileURLToPath, URL } from 'node:url' import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import AutoImport from 'unplugin-auto-import/vite' import Components from 'unplugin-vue-components/vite' import { VantResolver } from '@vant/auto-import-resolver' import externalGlobals from 'rollup-plugin-external-globals' import { createHtmlPlugin } from 'vite-plugin-html' // 文件压缩 import viteCompression from 'vite-plugin-compression' function getDir() { const d = new Date() const yy = d.getFullYear() const MM = d.getMonth() + 1 >= 10 ? d.getMonth() + 1 + '' : '0' + (d.getMonth() + 1) const DD = d.getDate() >= 10 ? d.getDate() + '' : '0' + d.getDate() const h = d.getHours() >= 10 ? d.getHours() + '' : '0' + d.getHours() const mm = d.getMinutes() >= 10 ? d.getMinutes() + '' : '0' + d.getMinutes() const version = yy + MM + DD + h + mm return version + '/static' } const dir = getDir() const cdn = { css: ['https://unpkg.com/vue3-pdf-app@1.0.3/dist/icons/main.css'], js: [ 'https://unpkg.com/vue@3.4.21/dist/vue.global.js', 'https://unpkg.com/vue-demi@0.14.8', 'https://unpkg.com/pinia@2.1.7', 'https://unpkg.com/vue-router@4.3.0', 'https://unpkg.com/vant@4.9.1', 'https://unpkg.com/axios@1.7.2/dist/axios.min.js', 'https://unpkg.com/echarts@5.5.1/dist/echarts.js', 'https://unpkg.com/moment@2.30.1/moment.js' ] } const externalGlobalsObj = { vue: 'Vue', 'vue-demi': 'VueDemi', pinia: 'Pinia', 'vue-router': 'VueRouter', vant: 'Vant', axios: 'axios', echarts: 'echarts', moment: 'moment' } export default defineConfig(({ mode }) => { const isProduction = mode === 'production' || mode === 'test' return { plugins: [ vue(), AutoImport({ resolvers: [VantResolver()] }), Components({ resolvers: [VantResolver()] }), createHtmlPlugin({ inject: { data: { cdnCss: isProduction ? cdn.css : [], cdnJs: isProduction ? cdn.js : [] } } }), //在plugins配置数组里添加gzip插件 viteCompression({ verbose: true, disable: false, threshold: 10240, algorithm: 'gzip', ext: '.gz' }), { ...externalGlobals(externalGlobalsObj), enforce: 'post', apply: 'build' } ], resolve: { alias: { '@': fileURLToPath(new URL('./src', import.meta.url)), '/img': fileURLToPath(new URL('./src/assets/img', import.meta.url)) }, extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'] }, build: { target: 'es2015', assetsDir: dir, minify: 'terser', // 必须开启:使用terserOptions才有效果 terserOptions: { compress: { keep_infinity: true, // 防止 Infinity 被压缩成 1/0,这可能会导致 Chrome 上的性能问题 drop_console: false, // 生产环境去除 console drop_debugger: true // 生产环境去除 debugger } }, chunkSizeWarningLimit: 2000, // chunk 大小警告的限制(以 kbs 为单位) rollupOptions: { external: Object.keys(externalGlobalsObj), output: { chunkFileNames: `${dir}/js/chunk/[name]-[hash].js`, entryFileNames: `${dir}/js/entry/[name]-[hash].js`, assetFileNames: `${dir}/[ext]/[name]-[hash].[ext]` } } }, css: { preprocessorOptions: { scss: { additionalData: `` } } } } })