注意点
- 部署路径,自动相对路径解析
- 设置别名
- 去除打包大小报告
- 打包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/**”),
}),
],
});
```