Question

我正在查看sound-redux中找到的源代码，这是一个在github上找到的repo：https://github.com/andrewngu/sound-redux。在查看webpack.config.js时，我无法弄清楚entry.main正在做什么。

module.exports = {
  // ...
  entry: {
    main: [
        './scripts/main.js',
        'webpack-dev-server/client?http://localhost:8080',
        'webpack/hot/only-dev-server'
    ]
  }
  // ...
}

这里实际发生了什么以及这个应用程序如何使用它？据我所知，文档对此功能完全保持沉默。

Answer 1

entry内的module.exports表示应用程序的入口点。现在main是多个入口点的示例。 main是入口点路径对象中数组的键，用作名称。考虑一下这个Webpack配置：

module.exports = {
    ...
    entry: {
        app: ['./path/to/main.js', './somewhere/else/index.js']
    },
    output: {
        path: "to/somewhere",
        filename: "[name].js"
    }
    ...
}

这样做的目的是为Code Splitting的多个文件设置应用程序的入口点，并输出到名为app.js的单个JS文件，因为给出了标签app。

在Webpack Docs了解详情。

Answer 2

{{1}}

条目是捆绑包的入口点。如果传递字符串：字符串将解析为启动时加载的模块。所以在上面的示例上下文中：__ dirname +“/ app”是入口点和条目的目录：“。/ entry”是条目文件名。输出将是一个bundle文件名：“bundle.js”。您可以为捆绑文件指定任何名称。

很好地解释

http://ui-codeman.blogspot.in/2017/02/webpack.html?view=sidebar

Webpack的入门目的是什么？主要是什么？

2 个答案: