vuecli3 生产开发测试环境以及输出文件目录打包配置

好的，以下是对应的配置：

1. 生产环境配置：

在`package.json`文件中，添加如下命令：

"build": "vue-cli-service build --mode production"

在根目录下创建`vue.config.js`文件，配置如下：

module.exports = {
  // 配置生产环境的打包输出目录
  outputDir: 'dist',
  // 配置生产环境的publicPath
  publicPath: '/',
  // 打包时不生成.map文件，减少打包体积
  productionSourceMap: false,
  // 生产环境下的webpack配置
  configureWebpack: config => {
    // 在生产环境中使用CDN加速，减少打包体积
    if (process.env.NODE_ENV === 'production') {
      config.externals = {
        'vue': 'Vue',
        'vue-router': 'VueRouter',
        'element-ui': 'ELEMENT',
        'axios': 'axios',
      }
    }
  }
}

2. 开发环境配置：

在`package.json`文件中，添加如下命令：

"serve": "vue-cli-service serve --mode development"

3. 测试环境配置：

在`package.json`文件中，添加如下命令：

"test": "vue-cli-service build --mode test"

在根目录下创建`vue.config.js`文件，配置如下：

module.exports = {
  // 配置测试环境的打包输出目录
  outputDir: 'dist-test',
  // 配置测试环境的publicPath
  publicPath: '/',
  // 打包时不生成.map文件，减少打包体积
  productionSourceMap: false,
  // 测试环境下的webpack配置
  configureWebpack: config => {
    // 在测试环境中使用CDN加速，减少打包体积
    if (process.env.NODE_ENV === 'test') {
      config.externals = {
        'vue': 'Vue',
        'vue-router': 'VueRouter',
        'element-ui': 'ELEMENT',
        'axios': 'axios',
      }
    }
  }
}

以上就是生产、开发和测试环境的配置，同时也可以通过`process.env.NODE_ENV`变量来区分不同的环境。