React构建多个文件

有没有什么办法如何在webpack构建过程中将React/Redux应用程序分割成模块？假设我有一些与用户有关的组件和与发票有关的其他组件。我希望webpack构建users.js和invoices.js，我可以将它们导入到index.html中，因为我可能会更改某些与用户相关的组件，所以我只需将生产服务器上的users.js交换为不受影响的invoices.js。React构建多个文件

这样的模块化是否可以实现？对于任何一种

来源

2016-05-02 Marek Sekyra

你在找什么的答案非常感谢是多个入口点

在这个例子中，你有两个（HTML）页面的用户和发票。您想要为每个页面创建单独的捆绑包。除此之外，您还想创建一个共享包，其中包含两个页面中使用的所有模块（假设有许多共同的大模块）。这些页面还使用代码分割按需加载较少使用的功能部分。

var path = require("path"); 
var webpack= require("webpack"); 
module.exports = { 
    entry: { 
     users: "./users", 
     invoices: "./invoices" 
    }, 
    output: { 
     path: path.join(__dirname, "js"), 
     filename: "[name].bundle.js", 
     chunkFilename: "[id].chunk.js" 
    }, 
    plugins: [ 
     new webpack.optimize.CommonsChunkPlugin({ 
      filename: "commons.js", 
      name: "commons" 
     }) 
    ] 
}

这里是一个更详细的example从自身的WebPack

来源

2016-05-02 23:53:23

我相信这是TT。我可以问减速机会发生什么吗？他们也将被包装在相应的包裹中？ –

减速器作为商店创建的一部分加载。从'./reducers'导入todoApp; let store = createStore（todoApp）'我假设你有一个商店并且是共享的。因此，减速器将被打包成一个通用捆绑包，这两个入口捆绑包将能够访问和消费。 –

现在，如果'users.js'和'invoices.js'需要不同的redux商店，情况会有所不同。如果他们依赖完全不同的商店，捆绑工作就像任何其他模块一样工作，那么'users.js'或'invoices.js'特有的任何东西都会相应地捆绑在其中。 –

React构建多个文件

回答

相关问题