解决vue项目配置测试环境后打包静态资源路劲错误

因为项目需要配置几个测试环境,以及生产环境，所以使用了 process.env.NODE_ENV 和启动命令 来区分打包的环境是哪一个。
完成后发现一个问题：当 输入 npm run test时 打包后的路径缺失了 config/index.js 里面的 assetsPublicPath 路径配置

assetsPublicPath 失效原因:

在build.js 文件的开头, 将环境命名改为 ‘testing’

process.env.NODE_ENV = 'testing'

解决 assetsPublicPath 失效方法:

打开 webpack.base.conf.js 文件
找到 output 修改如下:

output: {
    path: config.build.assetsRoot,
    filename: '[name].js',
    // 设置打包后静态资源访问路径
    publicPath: process.env.NODE_ENV === 'development'
      ? config.dev.assetsPublicPath
      : config.build.assetsPublicPath
  },

原代码配置如下:

output: {
  path: config.build.assetsRoot,
  filename: '[name].js',
  // 设置打包后静态资源访问路径
  publicPath: process.env.NODE_ENV === 'production'
    ?config.build.assetsPublicPath
    : config.dev.assetsPublicPath
},

解释: 比较代码可以发现, 当 process.env.NODE_ENV == 'production' 的时候, 打包会将 config.build.assetsPubilcPath 拼接到静态资源访问路径之前 所以当我将process.env.NODE_ENV 的值改为 'testing’的时候 打包会使用开发环境的路径配置, 所以导致 assetsPublicPath 失效
所以修改 publicPath 判断方法 即可正确使用 assetsPublicPath
注意: 设置之后会有开发环境启动空白页并报错 Unexpected token '<'
需要在 webpack.dev.conf.js 文件中添加一行 process.env.NODE_ENV = 'development'
表明这是开发环境 , 例如:

process.env.NODE_ENV = 'development' // 设置为开发环境防止启动空白页 
const baseWebpackConfig = require('./webpack.base.conf') // 加在这一行之前就好了