Webpack：output.path、publicPath 和 chunkFilename 为 html 和 js 文件不在同一文件夹中的项目选择概念

Question

来自 output.publicPath 的 webpack 文档：

Simple rule: The URL of your output.path from the view of the HTML page.
module.exports = { 
  output: {
    path: path.resolve(__dirname, 'public/assets'),
    publicPath: 'https://cdn.example.com/assets/'   
  } 
}; 

以上规则适用于单页应用程序，通常 index.html 和 index.js 在同一个文件夹中。然而，在多页网站的项目中，通常会创建特殊的文件夹，如js或scripts。所以项目输出文件夹的文件结构可能是这样的：

试了很多output.pathoutput.publicPath和output.chunkFilename的组合，还是不明白，如何正确select以上参数的组合使动态加载有效（例如 const MODULE = import('./loadOnDemand/testModule') 输出文件夹中的 chunks/chunk__0.js）。请告诉我概念，如何 select output.path publicPath 和 chunkFilename，它们适用于上述文件系统，也可以在以下文件系统上缩放：

Answer 1

您是否尝试过 webpack 魔术注释来自动定位块名称？ https://medium.com/faceyspacey/how-to-use-webpacks-new-magic-comment-feature-with-react-universal-component-ssr-a38fd3e296a

const MODULE = import(/* webpackChunkName: 'test' */'./loadOnDemand/testModule')

Webpack：output.path、publicPath 和 chunkFilename 为 html 和 js 文件不在同一文件夹中的项目选择概念

Webpack: output.path, publicPath and chunkFilename selecting concept for projects where html and js files are not in the same folder

javascript

dynamic-loading

webpack

webpack-4