javascript - Webpack 入口点语法困惑

Question

我正在研究一些代码以了解 webpack 及其功能并遇到了这段代码；

const path = require('path');
const docsBuild = {
  entry: {
    'app/docs/lib/dice-roller': './app/src/main.js'
  },
  output: {
    path: path.join(_dirname,''),
    filename: '[name].js'
  } 
};
module.exports = [docsBuild];

我不明白为什么在 entry main 属性的地方有一个文件路径，为什么 path.join 的第二个参数是空的。我是 webpack 的新手，我似乎无法在其文档中找到我的答案，也许我没有很好地搜索但帮助将不胜感激。

Answer 1

根据 webpack 文档:

entry :

The point or points to enter the application. At this point the application starts executing. If an array is passed all items will be executed.

所以这段代码:

entry: {
  'app/docs/lib/dice-roller': './app/src/main.js'
}

正在将 'app/docs/lib/dice-roller' 的入口点设置为 './app/src/main.js'

output.path :

The output directory as an absolute path.

path.join 的第二个参数是输出目录名称本身。在您的示例中是空的，但正如您在 example provided here 中看到的那样，对于以下项目结构:

  webpack-demo
  |- package.json
  |- webpack.config.js
  |- /dist
  |- /src

您可以在 __dirname 中设置此输出配置返回当前模块的目录名:

output: {
  filename: '[name].js',
  path: path.resolve(__dirname, 'dist')
}

还有 this 'options' documentation有一段可以澄清这一点:

Notice that throughout the configuration we use Node's built-in path module and prefix it with the __dirname global. This prevents file path issues between operating systems and allows relative paths to work as expected. See this section for more info on POSIX vs. Windows paths.

希望对你有帮助。