vite.confg.js npm run xxx和.env文件详解
在vite.config.js中: export default defineConfig(({ mode, command }) => { /** *参数: (1)mode: 就是运行npm run xxx的时候的模式,配置项"--mode"后面的字符串将被传入到defineConfig函数中
其中:.env文件是必读的,后面的.env.xxx会覆盖掉.env文件内容。变量名必须以"VITE_"开头
比如package.json中的脚本
"scripts": {
//npm run serve启动后默认读取.env.development文件,并将环境变量注入到import.meta.env中
//npm run build启动后默认读取.env.production文件,并将环境变量注入到import.meta.env中
//npm run build:stage启动后根据"--mode"后面的字符串读取.env.staging文件,并将环境变量注入到import.meta.env中
"serve": "vite", //相当于运行了 npm run serve --mode development,因为vite的默认环境就是development,所以可以省略"--mode development"
"build:prod": "vite build", //相当于运行了 npm run serve --mode build
"build:stage": "vite build --mode staging",
(2)command: "build" | "serve"*
*/
//process.cwd() 返回node进程的工作目录,如:G:\program_demo\vueProgram\RuoYi-Vue-master\RuoYi-Vue3
const env = loadEnv(mode, process.cwd()) //获取环境变量
console.log("process.cwd():",process.cwd());
console.log("env:",env);
const { VITE_APP_ENV } = env
return {
// 部署生产环境和开发环境下的URL。
// 默认情况下,vite 会假设你的应用是被部署在一个域名的根路径上
// 例如 https://www.ruoyi.vip/。如果应用被部署在一个子路径上,你就需要用这个选项指定这个子路径。例如,如果你的应用被部署在 https://www.ruoyi.vip/admin/,则设置 baseUrl 为 /admin/。
base: VITE_APP_ENV === 'production' ? '/' : '/',
plugins: createVitePlugins(env, command === 'build'),
resolve: {
// https://cn.vitejs.dev/config/#resolve-alias
alias: {
// 设置路径
'~': path.resolve(__dirname, './'),
// 设置别名
'@': path.resolve(__dirname, './src')
},
// https://cn.vitejs.dev/config/#resolve-extensions
extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue']
},
// vite 相关配置
}
})
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· AI技术革命,工作效率10个最佳AI工具