0
点赞
收藏
分享

微信扫一扫

Vite配置环境变量

夕颜合欢落 2022-03-12 阅读 54

Vite配置代码环境变量和 Vue2 的配置差不多,都是依靠 .env 文件夹来实现

详情可到 Vite 官网的环境配置里了解:环境变量和模式 {#env-variables-and-modes} | Vite中文网

一、在src同级下创建 .env.production 生产模式和 .env.development 开发模式两个文件夹

                        ​​​​​​​        ​​​​​​​        ​​​​​​​        

 二、文件夹内部分别写入https路径

 // .env.production 文件
# .env.production
VITE_APP_BASE_URL=http://localhost:3000

 // .env.development 文件
# .env.development
VITE_APP_BASE_URL=http://localhost:8080

 其Vite内部会暴露出一个 import.meta.env 出来 ,那我们就可以使用 import.meta.env.VITE_APP_BASE_URL 来渲染标题和请求

三、来到 package.json 文件

可以通过传递 --mode 选项标志来覆盖命令使用的默认模式 例如:

"dev": "vite --mode development",

使用的时候用  import.meta.env.VITE_APP_BASE_URL 即可

console.log( import.meta.env.VITE_APP_BASE_URL )

然后关闭项目重新跑起来就可以了

 

举报

相关推荐

0 条评论