From 41b7588062ed65455efcef09bed2cc027a5b01d9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B5=85=E5=BF=B5?= Date: Wed, 11 Mar 2026 11:43:59 +0800 Subject: [PATCH] =?UTF-8?q?=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- vite.config.ts | 272 +++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 272 insertions(+) create mode 100644 vite.config.ts diff --git a/vite.config.ts b/vite.config.ts new file mode 100644 index 0000000..d081702 --- /dev/null +++ b/vite.config.ts @@ -0,0 +1,272 @@ +import { defineConfig, loadEnv } from 'vite' +import vue from '@vitejs/plugin-vue' +import path from 'path' +import viteCompression from 'vite-plugin-compression' +import Components from 'unplugin-vue-components/vite' +import AutoImport from 'unplugin-auto-import/vite' +import { ElementPlusResolver } from 'unplugin-vue-components/resolvers' +import { fileURLToPath } from 'url' +// import viteImagemin from 'vite-plugin-imagemin' +// import { visualizer } from 'rollup-plugin-visualizer' + +// https://devtools.vuejs.org/getting-started/introduction +import vueDevTools from 'vite-plugin-vue-devtools' + +export default ({ mode }) => { + const root = process.cwd() + const env = loadEnv(mode, root) + const { VITE_VERSION, VITE_PORT, VITE_BASE_URL, VITE_API_URL } = env + + console.log(`🚀 API_URL = ${VITE_API_URL}`) + console.log(`🚀 VERSION = ${VITE_VERSION}`) + + return defineConfig({ + define: { + __APP_VERSION__: JSON.stringify(VITE_VERSION) + }, + base: VITE_BASE_URL, + server: { + port: parseInt(VITE_PORT), + proxy: { + '/api': { + target: VITE_API_URL, + changeOrigin: true, + rewrite: (path) => path.replace(/^\/api/, '') + } + }, + host: true, + allowedHosts: [ + 'web.dp.muzili.top' + ] + }, + // 路径别名 + resolve: { + alias: { + '@': fileURLToPath(new URL('./src', import.meta.url)), + '@views': resolvePath('src/views'), + '@imgs': resolvePath('src/assets/img'), + '@icons': resolvePath('src/assets/icons'), + '@utils': resolvePath('src/utils'), + '@stores': resolvePath('src/store'), + '@plugins': resolvePath('src/plugins'), + '@styles': resolvePath('src/assets/styles') + } + }, + build: { + target: 'es2015', + outDir: 'dist', + chunkSizeWarningLimit: 2000, + minify: 'terser', + terserOptions: { + compress: { + drop_console: true, // 生产环境去除 console + drop_debugger: true // 生产环境去除 debugger + } + }, + rollupOptions: { + output: { + manualChunks: { + vendor: ['vue', 'vue-router', 'pinia', 'element-plus'] + } + } + }, + dynamicImportVarsOptions: { + warnOnError: true, + exclude: [], + include: ['src/views/**/*.vue'] + } + }, + plugins: [ + vue(), + // 自动导入 components 下面的组件，无需 import 引入 + Components({ + deep: true, + extensions: ['vue'], + dirs: ['src/components'], // 自动导入的组件目录 + resolvers: [ElementPlusResolver()], + dts: 'src/types/components.d.ts' // 指定类型声明文件的路径 + }), + AutoImport({ + imports: ['vue', 'vue-router', '@vueuse/core', 'pinia'], + resolvers: [ElementPlusResolver()], + dts: 'src/types/auto-imports.d.ts', + eslintrc: { + // 这里先设置成true然后pnpm dev 运行之后会生成 .auto-import.json 文件之后，在改为false + enabled: true, + filepath: './.auto-import.json', + globalsPropValue: true + } + }), + // 打包分析 + // visualizer({ + // open: true, + // gzipSize: true, + // brotliSize: true, + // filename: 'dist/stats.html' // 分析图生成的文件名及路径 + // }), + // 压缩 + viteCompression({ + verbose: true, // 是否在控制台输出压缩结果 + disable: false, // 是否禁用 + algorithm: 'gzip', // 压缩算法,可选 [ 'gzip' , 'brotliCompress' ,'deflate' , 'deflateRaw'] + ext: '.gz', // 压缩后的文件名后缀 + threshold: 10240, // 只有大小大于该值的资源会被处理 10240B = 10KB + deleteOriginFile: false // 压缩后是否删除原文件 + }), + // 图片压缩 + // viteImagemin({ + // verbose: true, // 是否在控制台输出压缩结果 + // // 图片压缩配置 + // // GIF 图片压缩配置 + // gifsicle: { + // optimizationLevel: 4, // 优化级别 1-7，7为最高级别压缩 + // interlaced: false // 是否隔行扫描 + // }, + // // PNG 图片压缩配置 + // optipng: { + // optimizationLevel: 4 // 优化级别 0-7，7为最高级别压缩 + // }, + // // JPEG 图片压缩配置 + // mozjpeg: { + // quality: 60 // 压缩质量 0-100，值越小压缩率越高 + // }, + // // PNG 图片压缩配置(另一个压缩器) + // pngquant: { + // quality: [0.8, 0.9], // 压缩质量范围 0-1 + // speed: 4 // 压缩速度 1-11，值越大压缩速度越快，但质量可能会下降 + // }, + // // SVG 图片压缩配置 + // svgo: { + // plugins: [ + // { + // name: 'removeViewBox' // 移除 viewBox 属性 + // }, + // { + // name: 'removeEmptyAttrs', // 移除空属性 + // active: false // 是否启用此插件 + // } + // ] + // } + // }) + vueDevTools() + ], + // 预加载项目必需的组件 + optimizeDeps: { + include: [ + 'vue', + 'vue-router', + 'pinia', + 'axios', + '@vueuse/core', + 'echarts', + '@wangeditor/editor', + '@wangeditor/editor-for-vue', + 'vue-i18n', + 'element-plus/es/components/form/style/css', + 'element-plus/es/components/form-item/style/css', + 'element-plus/es/components/button/style/css', + 'element-plus/es/components/input/style/css', + 'element-plus/es/components/input-number/style/css', + 'element-plus/es/components/switch/style/css', + 'element-plus/es/components/upload/style/css', + 'element-plus/es/components/menu/style/css', + 'element-plus/es/components/col/style/css', + 'element-plus/es/components/icon/style/css', + 'element-plus/es/components/row/style/css', + 'element-plus/es/components/tag/style/css', + 'element-plus/es/components/dialog/style/css', + 'element-plus/es/components/loading/style/css', + 'element-plus/es/components/radio/style/css', + 'element-plus/es/components/radio-group/style/css', + 'element-plus/es/components/popover/style/css', + 'element-plus/es/components/scrollbar/style/css', + 'element-plus/es/components/tooltip/style/css', + 'element-plus/es/components/dropdown/style/css', + 'element-plus/es/components/dropdown-menu/style/css', + 'element-plus/es/components/dropdown-item/style/css', + 'element-plus/es/components/sub-menu/style/css', + 'element-plus/es/components/menu-item/style/css', + 'element-plus/es/components/divider/style/css', + 'element-plus/es/components/card/style/css', + 'element-plus/es/components/link/style/css', + 'element-plus/es/components/breadcrumb/style/css', + 'element-plus/es/components/breadcrumb-item/style/css', + 'element-plus/es/components/table/style/css', + 'element-plus/es/components/tree-select/style/css', + 'element-plus/es/components/table-column/style/css', + 'element-plus/es/components/select/style/css', + 'element-plus/es/components/option/style/css', + 'element-plus/es/components/pagination/style/css', + 'element-plus/es/components/tree/style/css', + 'element-plus/es/components/alert/style/css', + 'element-plus/es/components/radio-button/style/css', + 'element-plus/es/components/checkbox-group/style/css', + 'element-plus/es/components/checkbox/style/css', + 'element-plus/es/components/tabs/style/css', + 'element-plus/es/components/tab-pane/style/css', + 'element-plus/es/components/rate/style/css', + 'element-plus/es/components/date-picker/style/css', + 'element-plus/es/components/notification/style/css', + 'element-plus/es/components/image/style/css', + 'element-plus/es/components/statistic/style/css', + 'element-plus/es/components/watermark/style/css', + 'element-plus/es/components/config-provider/style/css', + 'element-plus/es/components/text/style/css', + 'element-plus/es/components/drawer/style/css', + 'element-plus/es/components/color-picker/style/css', + 'element-plus/es/components/backtop/style/css', + 'element-plus/es/components/message-box/style/css', + 'element-plus/es/components/skeleton/style/css', + 'element-plus/es/components/skeleton/style/css', + 'element-plus/es/components/skeleton-item/style/css', + 'element-plus/es/components/badge/style/css', + 'element-plus/es/components/steps/style/css', + 'element-plus/es/components/step/style/css', + 'element-plus/es/components/avatar/style/css', + 'element-plus/es/components/descriptions/style/css', + 'element-plus/es/components/descriptions-item/style/css', + 'element-plus/es/components/checkbox-group/style/css', + 'element-plus/es/components/progress/style/css', + 'element-plus/es/components/image-viewer/style/css', + 'element-plus/es/components/empty/style/css', + 'element-plus/es/components/segmented/style/css', + 'element-plus/es/components/calendar/style/css', + 'element-plus/es/components/message/style/css', + 'xlsx', + 'file-saver', + 'element-plus/es/components/timeline/style/css', + 'element-plus/es/components/timeline-item/style/css', + 'vue-img-cutter' + ] + }, + css: { + preprocessorOptions: { + // sass variable and mixin + scss: { + api: 'modern-compiler', + additionalData: ` + @use "@styles/variables.scss" as *; @use "@styles/mixin.scss" as *; + ` + } + }, + postcss: { + plugins: [ + { + postcssPlugin: 'internal:charset-removal', + AtRule: { + charset: (atRule) => { + if (atRule.name === 'charset') { + atRule.remove() + } + } + } + } + ] + } + } + }) +} + +function resolvePath(paths) { + return path.resolve(__dirname, paths) +}