Vue.js Vue cli代码拆分会创建一个具有很长名称的文件，该文件可以'；不招待

我使用的是vue cli 3.3.0，我在router.js文件中使用了代码拆分：

...
{
      path: "/compliance_checks",
      name: "compChecks",
      meta: {
        requiresAuth: true
      },
      component: () =>
        import("@/shared/policies/compliance/ComplianceChecksPage" /* webpackChunkName: "ComplianceChecksPage" */)
    },
    {
      path: "/firewalls",
      name: "firewalls",
      meta: {
        requiresAuth: true
      },
      component: () =>
        import("@/shared/policies/firewall/ContainerFirewallsPage" /* webpackChunkName: "ContainerFirewallsPage" */)
    },
...

当文件由dev服务器提供服务时，在dev模式下一切正常。但是在运行build之后，我从我的服务器上得到了一个404错误（用go编写）

我看到它试图访问一个名称很长的文件：

如果我手动缩短文件名（在dist文件夹中），它会设法加载它。因此问题肯定是文件名的长度

这是我的vue.config.js：

chainWebpack: config => {
    config.output.chunkFilename(`js/[name].[id].[chunkhash:8].js`);
  },

是否可以控制生成的文件名？

将配置更改为：

chainWebpack:config=>{
config.output.chunkFilename（`js/[id].[chunkhash:8].js`）；
},

这将消除长模块名

如果仍然太长，则

id

（模块标识符）包含您的长路由。请使用[hash]而不是[id]。这将是

id

的哈希，而不是

id

本身

chainWebpack:config=>{
config.output.chunkFilename（`js/[hash].[chunkhash:8].js`）；
},

现在，您的文件名将反映文件的路径和内容

此外，惯例是将代码拆分注释放在第一位

import（/*webpackChunkName:“ComplianceCheckPage”*/“@/shared/policies/compliance/ComplianceCheckPage”）

这很有帮助，谢谢，但它仍然会生成一个相当长的文件名，并且随着我添加更多路由，文件名会变长，因此仍然存在一个问题。看起来我只需要使用chunkhash：（当您删除[id]时，“长名称”是否会被删除？您可能需要尝试：

[hash][chunkhash].js

。这是模块id的散列和内容的散列。因此，如果更改路由，但不更改内容，它仍将更改。我更改为：

config.output.chunkFilename（'js/[chunkhash:8].js'））

这是可行的，但问题是我没有正常的文件名如果你有两个内容相同的文件，可能会有问题……这就是[hash]有用的地方