Vuew和webpack延迟加载。块文件在哪里定义？

Question

使用vuejs，https://router.vuejs.org/en/advanced/lazy-loading.html。

我运行了示例代码。

在使用延迟加载的示例中，定义了0.chunk.js和1.chunk.js在哪里？

webpack文档说“非条目块文件”，但我们如何定义这些块文件。我查看了vue-router示例代码，但无法弄明白。

Answer 1

您可以在/examples/webpack.config.js，github中找到延迟加载定义。在输出配置中，其配置如下

  output: {
    path: path.join(__dirname, '__build__'),
    filename: '[name].js',
    chunkFilename: '[id].chunk.js',
    publicPath: '/__build__/'
  },

Answer 2

这些块通常在您的js/manifest.js文件中定义，并由webpack为此目的生成。

在我的看起来像这样（经过漂亮印刷）

o.src = a.p + "js/" + e + "." + {
    0: "796f1d0e67b998e17b3f",
    1: "81d71d5e62996e7658f9",
    2: "4775738f0618fa75e735",
    3: "fd3c35ef3f5142e14115",
    4: "7ad17212637dbc558b8a",
    ...
}[e] + ".js";

这些块是基于路由器文件构建的。你还应该注意到在js文件夹中它有e.chunkID.js，它对应于那个列表。