vue打包前开发测试生产环境接口地址配置


npm run dev     //开发环境

npm run test   //打包测试环境

npm run build   //打包生产环境

1、新建webpack.test.conf.js

    在build文件夹下面新建webpack.test.conf.js文件,复制webpack.prod.conf.js的内容到webpack.test.conf.js,然后修改下面内容

const env = require('../config/prod.env')

改为:

const env = require('../config/test.env')

2、 新建test.js

    在build文件夹下面新建test.js文件,复制build.js的内容到test.js,然后修改下面内容

const webpackConfig = require('./webpack.prod.conf')

改为:

const webpackConfig = require('./webpack.test.conf')

3、新建test.env.js

    在config文件夹下面新建test.env.js文件,复制test.env.js的内容到test.env.js

4、配置地址

dev.env.js

'use strict'

const merge = require('webpack-merge')

const prodEnv = require('./prod.env')

module.exports = merge(prodEnv, {

    NODE_ENV: '"development"',

    API_ROOT:'"http://..."'   //新增的一个变量,配置开发接口地址,注意api双引号外面还有一层单引号

})

test.env.js

'use strict'

module.exports = {

    NODE_ENV: '"production"',

    API_ROOT:'"http://..."'    //测试地址,注意

}

prod.env.js

'use strict'

module.exports = {

    NODE_ENV: '"production"',

    API_ROOT:'"http://..."'    //线上地址,注意

}

5、修改package.json

6、 mian.js中配置axios接口地址

axios.defaults.baseURL = process.env.API_ROOT;

好了这样就可以



详细请看下面链接:

https://segmentfault.com/a/1190000016664571

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容