vue根据不同的环境使用不同的接口地址
vue根据不同的环境使用不同的接口地址1. 在根目录下新建一个js文件夹。目录结构如下:2. 新建setBaseUrl.js文件在js文件夹下添加setBaseUrl.js文件,内容如下:let baseUrl = "";let allUrls = {};let nodeEnv = process.env.NODE_ENV;switch (nodeEnv) {case 'development':
·
1. 在根目录下新建一个js
文件夹。
目录结构如下:
2. 新建setBaseUrl.js
文件
在js
文件夹下添加setBaseUrl.js
文件,内容如下:
let baseUrl = "";
let allUrls = {};
let nodeEnv = process.env.NODE_ENV;
switch (nodeEnv) {
case 'development':
baseUrl = 'http://192.168.161.186:8080/DLCPManager';
break;
case 'test':
baseUrl = 'http://192.168.171.193:8080/DLCPManager';
break;
case 'production':
baseUrl = 'https://datalabel.echargenet.com/api';
break;
default:
baseUrl = 'https://datalabel.echargenet.com/api';
}
allUrls = {
"baseUrl": baseUrl
}
export default allUrls;
development是开发环境,test是测试环境,production是生产环境。
3. 在main.js
中引入
在main.js
中添加如下内容:
import allUrls from './js/setBaseUrl';
axios.defaults.baseURL = allUrls.baseUrl;
allUrls.baseUrl就是接口地址;
4. 修改package.json
文件
添加打包不同的环境的指令。
在package.json中scripts
下添加如下内容:
"dev": "vue-cli-service build --mode dev",
"test": "vue-cli-service build --mode test"
5. 修改README.md
文件
修改README.md文件,添加说明文档。
在README.md中添加如下内容:
6. 打包
- 在生产环境下打包:
npm run build
- 在测试环境下打包:
npm run test
- 在开发环境下打包:
npm run dev
打包完成之后,放到服务器上,就会自动加载不同的接口地址。
更多推荐
已为社区贡献18条内容
所有评论(0)