vue 分环境打包配置

在config下新建 test.env.js 文件

在dev.env.js文件中改成 这里是因为项目做了代理解决跨域的问题

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  VN_CONFIG: '"dev"',
  API_ROOT: '"/apis"'

})

在prod.env.js 文件中改成

// 改成你的环境域名就行  正式和测试的
'use strict'
const target = process.env.npm_lifecycle_event;
if (target == 'test') {
  //测试环境
  var obj = {
    NODE_ENV: '"production"',
    //post用当前域名
    API_ROOT: '"https://"',
    //数据字典
    API_ROOT_DICT: '"https://"',
  }
} else if (target == 'prod') {
  //线上环境
  var obj = {
    NODE_ENV: '"production"',
    //post用当前域名
    API_ROOT: '"http://"',
    //数据字典
    API_ROOT_DICT: '"http://"',
  }
}
module.exports = obj;

> 在package.json 中

```js
"scripts": {
    "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
    "start": "npm run dev",
    "build": "node build/build.js",
    "test": "node build/build.js",
    "prod": "node build/build.js"
  },

请求接口是分装的 我有一篇写到分装的方法了 必须要将请求的地址方法改成下面的

Ajax: function (method, url, data) {
    return new Promise((resolve, reject) => {
      axios({
          method: method,
          url: process.env.API_ROOT + url, //打包
          data: data,
          dataType: 'jsonp',
          headers: {
            Token: VueCookies.get('token'),
            Logintime: VueCookies.get('logintime'),
          },
        })
        .then(res => {
          resolve(res.data);
        })
        .catch(err => {
          reject(err);
        });
    });
  },

测试环境

npm run test

正式环境

npm run prod

**将打包好的dist文件上传到服务器上就Ok了 这里注意如果dist文件的内容直接放到服务器上 生成的index.html文件 把所有引用的 文件

/static/
./static/

路径全都要加上 . 所有的/static/前 否知 页面没有样式 会是空白的**