注意点

  • 部署路径,自动相对路径解析
  • 设置别名
  • 去除打包大小报告
  • 打包gizp压缩
  • 框架自动按需导入
  • 全局样式导入配置(相对路径引入, app.vue中使用scss) ```javascript import { defineConfig } 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 { NaiveUiResolver } from ‘unplugin-vue-components/resolvers’ import vue18n from “@intlify/vite-plugin-vue-i18n”;

// https://vitejs.dev/config/ export default defineConfig({ base: process.env.NODE_ENV === “production” ? “./“ : “/“, resolve: { alias: [{ find:’@’, replacement: path.resolve(dirname, ‘src’) }] }, css: { preprocessorOptions: { scss: { additionalData: @import './src/styles/index.scss'; }, }, }, build: { brotliSize: false, reportCompressedSize: false, chunkSizeWarningLimit: 2000, minify: “terser”, terserOptions:{ compress: { drop_console: true, drop_debugger: true } } }, plugins: [ vue(), viteCompression(), Components({ resolvers: [NaiveUiResolver()] }), vue18n({ include: path.resolve(dirname, “./src/locales/**”), }), ], });

```

image.png