可以为webpack输出单独的浏览器和节点的脚本和模块文件吗？

Question

我正在使用webpack创建一个JavaScript对象，可以通过浏览器加载（在脚本标记中），但我也希望webpack创建一个可以由节点加载的模块（需要module.exports =）。

有没有办法让webpack制作两个文件;例如一个project.js和project.node.js？还是我以错误的方式去做这件事？

的D3 JavaScript库似乎基于其package.json

{ 
    "main": "build/d3.node.js", 
    "browser": "build/d3.js", 
    ... 
} 

Answer 1

我发现怎么弄的WebPack使多个文件here在做这样的事情 - 基本上只是出口对象，而不仅仅是一个在数组webpack.config.js。

以下是我在使用相同入口点main.js制作多个文件的webpack.config.js。

module.exports = [ 
    { 
     entry: './src/main.js', 
     output: { 
     path: __dirname, 
     filename: 'my_project.js', 
     libraryTarget: 'var', 
     library: 'my_project' 
     }, 
     ... 
    }, 
    { 
     entry: './src/main.js', 
     output: { 
     path: __dirname, 
     filename: 'my_project.node.js', 
     libraryTarget: 'commonjs2', 
     library: 'my_project' 
     } 
     ... 
]; 

我正在两个文件：1）my_project.js与libraryTarget设置为var使得它可以通过使用脚本标签的浏览器被装载和2）my_project.node.js与libraryTarget设置为commonjs2使得节点可以加载它。

我在package.json把my_project.node.jsmain下，这样的WebPack将加载 - 见下：

{ 
    "name": "my_project", 
    "version": "1.0.0", 
    "description": "something ...", 
    "main": "my_project.node.js", 
    ... 
}