背景：我有一个由Vue-cli3.X创建的多页项目。在某些条目（页面）中导入了名为 aepConfig.js 的配置文件。这些配置将在生产中使用，例如Web端口，站点名称，API路径等。

问题：：使用npm run build构建生产代码后，我发现这些配置将捆绑到chunk-common.js中。

目标：我想将这些配置代码拆分为一个文件，例如： aepConfig。[hash] .js

我尝试了以下方法：

1. 使用动态导入config: () => import(/* webpackChunkName: "aepConfig" */ "./aepConfig.js")。这种方法肯定会拆分代码，但是我在语法上使用这些配置，并且动态导入将返回一个Promise。

2. 使用如下所示的splitChunk，但是无论我设置了什么选项，它都不会生成 aepConfig。[hash] .js （也许我丢失了一些东西）。

splitChunks: {
  cacheGroups: {
   // I didn't know the key if is correct.
   // Maybe use 'common'? Anyone can explain it?
    aepConfig: {
      test: module => {
        module
          .identifier()
          .split('/')
          .reduceRight(item => item)
          .indexOf('aepConfig') !== -1
      },enforce: true,chunks: 'all',reuseExistingChunk: true,maxInitialRequests: 20,minChunks: 1,minSize: 0,priority: 10
    }
  }
}

1. 使用chainWebpack：

chainWebpack: config => {
  config.entry('aepConfig').add('@/assets/scripts/aepConfig.js')
}

此方法拆分代码，并生成aepConfig。[hash] .js，但在此文件中，我发现：

// snippets code in aepConfig.[hash].js
e.exports = t("b8e3");

“ b8e3”表示函数的名称，该函数将在 chunck-common中返回我的配置。[hash] .js

// snippets code in chunck-common.[hash].js
b8e3: function(e,n) {
  e.exports = {
    corsDomain: "http://example.domain.com",corsMainPort: 80,sharePort: 81,samplePort: 85,simulatorPort: 86,emergencyPort: 83,frameJS: "/scripts/frame.js",defaultProvince: "XX省",defaultCity: "XX市",defaultArea: "XX区"
  };
}

Emm ...此代码就像脱裤子放屁一样。如果可以将 chunk-common。[hash] .js 中关于确认的代码移到 aepConfig。[hash] .js 中，那将是完美的。

1. 我考虑在某些条目的模板文件（index.html）中添加<script src="/js/aepConfig.[hash].js"></script>。但是它需要修改许多文件，并将aepConfig.js转换为UMD，因为我将此配置文件导入了一些js文件。

所以〜

我想知道是否有可能实现我的目标。
  问题1：在第二种方法中，aepConfig下面的键cacheGroups是否正确？
  问题2：为什么我的配置代码仍然在第三种方法中的chunk-common.js中？