为什么 [name] 总是 main 在 MiniCssExtractPlugin for webpack 中？

Question

在webpack中配置MiniCssExtractPlugin时，不明白为什么[name]总是“main”？

 plugins: [
   new MiniCssExtractPlugin({
      filename: 'assets/css/[name].css' // where does the name "main" come from?
    }) 
  ]

我怎么能传入一个变量，以便 [name] 是我的应用程序的名称而不是“main”而不用像这样的硬编码filename: 'assets/css/myapp.css'？

网络包output配置：

module.exports = {
  entry: './src/app.js',
  output: {
    path: utils.resolve('/dist'),
  },

奇怪的是，即使是 Webpack 也会将主包文件创建为main.js. 为什么主要？

Answer 1

该[name]是入口点的名称。

如果入口点是 aString或Arraywebpack 将使用 aa 默认入口名称main，基于https://github.com/webpack/webpack/blob/6f413ae2e63897aef5e1956cb1c351ab33f6dbfe/lib/EntryOptionPlugin.js#L76。

你可以提供你的入口点作为一个对象，

module.exports = {
  entry: { myName: './src/app.js'},
  output: {
    path: utils.resolve('/dist'),
  },
  ...
}

这会将条目名称更改为myName.