React Build mehrere Dateien

Question

Gibt es eine Möglichkeit, wie React/Redux-Anwendung in Module während Webpack Build aufgeteilt? Nehmen wir an, ich habe einige Komponenten, die sich auf Benutzer und andere beziehen, die sich auf Rechnungen beziehen. Ich möchte, dass webpack users.js und rechnungen.js erstellt, die ich in index.html importieren könnte, und da ich einige benutzerbezogene Komponenten ändern könnte, tausche ich users.js einfach auf dem Produktionsserver aus, wobei rechnungen.js unberührt bleiben.

Ist eine solche Modularität möglich? Vielen Dank für Antworten jeglicher Art

Answer 1

Was Sie suchen, ist mehrere Einstiegspunkte

In diesem Beispiel haben Sie zwei (HTML) Seiten Benutzer und Rechnungen. Sie möchten für jede Seite ein einzelnes Bündel erstellen. Außerdem möchten Sie ein gemeinsames Paket erstellen, das alle Module enthält, die auf beiden Seiten verwendet werden (vorausgesetzt, es gibt viele/große Module gemeinsam). Die Seiten verwenden auch Code Splitting, um einen weniger genutzten Teil der Features bei Bedarf zu laden.

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" 
     }) 
    ] 
} 

hier ist ein detaillierteres example von webpack selbst