- 修改 vite.config.js 配置文件
打包部署需要按需求配置 base、build 选项
import { defineConfig, loadEnv } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path'
export default defineConfig(({ mode }) => {
const env = loadEnv(mode, __dirname)
return {
plugins: [vue()],
base: env.VITE_MODE === 'production' ? './' : '/',
resolve: {
alias: {
'@': path.resolve(__dirname, 'src'),
}
},
css: {
// 全局样式配置
preprocessorOptions: {
scss: {
additionalData: `@import "@/assets/base.scss";`,
},
less: {
additionalData: `@import "@/assets/base.less";`,
}
}
},
build: {
sourcemap: false, // 不生成 source map
terserOptions: {
compress: { // 打包时清除 console 和 debug 相关代码
drop_console: true,
drop_debugger: true,
},
},
},
server: {
host: 'localhost',
port: '8080',
open: true,
proxy: {
'/api': {
target: env.VITE_URL,
changeOrigin: true,
ws: true, // 支持 websocket
rewrite: (path) => path.replace(/^\/api/, '') // 路径重写
}
}
}
}
})
- 打包
npm run build
- 启动本地服务测试
// 全局安装
npm install http-server -g
// 在 dist 根目录下执行
http-server
// 在浏览器上运行 http 生成的 url
