webstorm vue解决线上环境与测试环境接口地址问题

一、

在config->index.js中，将dev中的proxyTable：{ }变为

proxyTable: {
      '/api': {
        target: 'https://xx.xxxx.com',//接口地址的公共部分
        changeOrigin: true,
        pathRewrite: {
          '/api': ''
        }
      }
    },

二、

在config->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://xx.xxxx.com"'//接口的公共地址
})

三、

在config->prod.env.js中将代码变为

'use strict'
module.exports = {
  NODE_ENV: '"production"',
  API_ROOT: '"http://xx.xxxx.com"'//接口的公共地址
}

四、在src->api->index.js中添加代码

var smaBaseUrl = '/api'
if (process.env.NODE_ENV === 'production') {
  smaBaseUrl = process.env.API_ROOT
}

之后在写接口地址时就可以写

 smaBaseUrl + '/getindexpic'

测试环境和线上环境就都可以直接用了