vueC-cli3 测试环境打包js文件配置

### vue-cli3 在打包测试环境时js代码不在js文件下的问题， 先说一下我环境的配置

###### 分别打包三个环境代码 dev test prod 

 

###### 结果在打包测试环境代码时，js被打包至与html同级目录下，虽然这不影响生产环境的打包目录，但是想要打包后的js文件都是存放在js文件目录下，该如何做呢？？？

###### 只要在vue.config.js里面添加配置就可以了

```

```

```

const path = require('path')

const IS_PROD = ['development'].includes(process.env.NODE_ENV)

const productionSourceMap = !IS_PROD

const filenameHashing = true

const assetsDir = ''

function resolve(dir) {

  return path.join(__dirname, dir)

}

function getAssetPath(assetsDir, filePath) {

  return assetsDir ? path.posix.join(assetsDir, filePath) : filePath

}

module.exports = {

  // 默认在生成的静态资源文件名中包含hash以控制缓存

  filenameHashing: filenameHashing,

  chainWebpack: config => {

    config.resolve.symlinks(true)

    // 移除 prefetch 插件

    config.plugins.delete('prefetch')

    // 移除 preload 插件

    config.plugins.delete('preload')

    // 压缩代码

    config.optimization.minimize(true)

    // 分割代码

    config.optimization.splitChunks({

      chunks: 'all'

    })

    // 配置别名

    config.resolve.alias

      .set('vue$', 'vue/dist/vue.esm.js') //此处使用Compiler，之前为Runtime版本

      .set('@', resolve('src'))

      .set('assets', resolve('src/assets'))

      .set('components', resolve('src/components'))

      .set('router', resolve('src/router'))

      .set('utils', resolve('src/utils'))

      .set('static', resolve('src/static'))

      .set('store', resolve('src/store'))

    if ( process.env.NODE_ENV === 'development' || process.env.NODE_ENV === 'test') {

      const isLegacyBundle =

        process.env.VUE_CLI_MODERN_MODE && !process.env.VUE_CLI_MODERN_BUILD

      const filename = getAssetPath(

        assetsDir,

        `js/[name]${isLegacyBundle ? `-legacy` : ``}${

          filenameHashing ? '.[hash:8]' : ''

        }.js`

      )

      config

        .mode('development')

        .devtool(productionSourceMap ? 'source-map' : false)

        .output.filename(filename)

        .chunkFilename(filename)

    }

  },

  lintOnSave: process.env.NODE_ENV === 'development', // 本地开发时开启eslint规范

  devServer: {

    port: 8080, //端口号

    proxy: {

      '/admin': {

        target: '', //test

        timeout: 6 * 60 * 1000,

        ws: true,  是否启用websockets

        changeOrigin: true, //开启代理：在本地会创建一个虚拟服务端，然后发送请求的数据，并同时接收请求的数据，这样服务端和服务端进行数据的交互就不会有跨域问题

        pathRewrite: {

          '^/admin': '' //这里重写路径

        }

      }

    }

  }

}

 

```