vue多环境配置

   日期:2020-08-23     浏览:89    评论:0    
核心提示:1.首先替换你的项目根目录中的下列文件来指定环境变量:.env # 在所有的环境中被载入.env.local # 在所有的环境中被载入,但会被 git 忽略.env.[mode] # 只在指定的模式中被载入.env.[mode].local # 只在指定的模式中被载入,但会被 git 忽略注:如果有替换掉,如果没有新建,[mode]代表变量,.local会被git忽略附:这里是我项目配置的三个环境配置一个环境文件只包含环境变

1.首先替换你的项目根目录中的下列文件来指定环境变量:

.env                # 在所有的环境中被载入
.env.local          # 在所有的环境中被载入,但会被 git 忽略
.env.[mode]         # 只在指定的模式中被载入
.env.[mode].local   # 只在指定的模式中被载入,但会被 git 忽略

注:如果有就替换掉,如果没有就新建,[mode]代表变量,.local会被git忽略
附:这里是我项目配置的三个环境配置
一个环境文件只包含环境变量的“键=值”对:

NODE_ENV = 'test'
NODE_ENV = 'development'
NODE_ENV = 'production'

注:为一个特定模式准备的环境文件 (例如 .env.production) 将会比一般的环境文件 (例如 .env) 拥有更高的优先级。
此外,Vue CLI 启动时已经存在的环境变量拥有最高优先级,并不会被 .env 文件覆写。
如果在环境中有默认的 NODE_ENV,你应该移除它或在运行 vue-cli-service 命令的时候明确地设置 NODE_ENV

2.然后在package.json中配置不同环境的打包命令:
附我的打包命令代码:build为默认打包命令,这里我圈起来的就是我们刚才配置的不同环境的打包命令
重点:–mode 选项参数为命令行覆写默认的模式,例如,如果你想要在构建命令中使用开发环境变量就要加上–mode

3.然后开始配置不同环境对应不同的请求前缀 ,也就是不同的域名或者ip地址,一般这个文件是放在config文件夹中你随便创建一个js文件
附我的不同环境下的域名(这里的域名我随便写的,baseurl = ‘这里写你的请求地址’)

4.然后在你的请求js文件中使用baseUrl,附我的request.js
然后你就可以打包不同的环境了
记得先安装依赖(安装依赖方法:在你的终端里写cnpm i,然后回车,等安装完就OK了,如果你运行cnpm i报错了,就在终端里执行npm install -g cnpm --registry=https://registry.npm.taobao.org,然后再安装依赖)
例如我的代码现在的打包命令就是: npm run test / npm run dev / npm run prod(三个环境选择一个你需要的进行打包)——>cd dist ——> http-server,搞定

觉得小弟写的还不错的,记得点赞打赏,感激不尽

 
打赏
 本文转载自:网络 
所有权利归属于原作者,如文章来源标示错误或侵犯了您的权利请联系微信13520258486
更多>最近资讯中心
更多>最新资讯中心
0相关评论

推荐图文
推荐资讯中心
点击排行
最新信息
新手指南
采购商服务
供应商服务
交易安全
关注我们
手机网站:
新浪微博:
微信关注:

13520258486

周一至周五 9:00-18:00
(其他时间联系在线客服)

24小时在线客服