2016-05-01 6 views
1

Ich habe Probleme zu visualisieren, wie ich die DllPlugin/DllReferencePlugin mit Webpack nutzen und gleichzeitig Grunt für das Gebäude verwenden kann. Für diejenigen ohne Wissen erstellt die DllPlugin ein separates Bundle, das mit anderen Bundles geteilt werden kann. Es erstellt auch eine Manifest-Datei (wichtig), um mit der Verknüpfung zu helfen. Dann wird das DllReferencePlugin von einem anderen Bundle beim Aufbau verwendet, um das zuvor erstellte DllPlugin Bundle zu greifen. Dazu wird die zuvor erstellte Manifestdatei benötigt.Grunt, Webpack und das DllPlugin

In Grunt würde dies die Manifest-Datei erfordern, die erstellt wird, bevor grunt läuft, nein? Heres ein vereinfachtes Codebeispiel:

webpack.dll.js

// My Dll Bundles, which creates 
// - ./bundles/my_dll.js 
// - ./bundles/my_dll-manifest.json 
module.exports = { 

    entry: { 
     my_dll : './dll.js' 
    }, 
    // where to send final bundle 
    output: { 
     path: './bundles', 
     filename: "[name].js" 
    }, 
    // CREATES THE MANIFEST 
    plugins: [ 
     new webpack.DllPlugin({ 
      path: "./bundles/[name]-manifest.json", 
      name: "[name]_lib" 
     }) 
    ] 
}; 

webpack.app.js

// My Referencing Bundle, which includes 
// - ./bundles/app.js 
module.exports = { 

    entry: { 
     my_app : './app.js' 
    }, 
    // where to send final bundle 
    output: { 
     path: './bundles', 
     filename: "[name].js" 
    }, 
    // SETS UP THE REFERENCE TO THE DLL 
    plugins: [ 
     new webpack.DllReferencePlugin({ 
      context: '.', 
      // IMPORTANT LINE, AND WHERE EVERYTHING SEEMS TO FAIL 
      manifest: require('./bundles/my_dll-manifest.json') 
     }) 
    ] 
}; 

Wenn Sie im zweiten Abschnitt aussehen, webpack.app .js, ich habe kommentiert, wo alles in grunt scheitern würde. Damit das DllReferencePlugin funktioniert, benötigt es die Manifestdatei aus dem DllPlugin, aber in einem Grunt-Workflow lädt grunt beide dieser Konfigurationen bei der Initialisierung von grunt selbst, was dazu führt, dass die Zeile fehlschlägt, weil der vorherige Grunt-Schritt webpack.dll.js erstellt hat nicht abgeschlossen, dh Manifest existiert noch nicht.

Antwort

1
var path = require("path"); 
var util = require('util') 
var webpack = require("webpack"); 

var MyDllReferencePlugin = function(options){ 
    webpack.DllReferencePlugin.call(this, options); 
} 

MyDllReferencePlugin.prototype.apply = function(compiler) { 
    if (typeof this.options.manifest == 'string') { 
     this.options.manifest = require(this.options.manifest); 
    } 

    webpack.DllReferencePlugin.prototype.apply.call(this, compiler); 
}; 


// My Referencing Bundle, which includes 
// - ./bundles/app.js 
module.exports = { 

    entry: { 
     my_app : './app.js' 
    }, 
    // where to send final bundle 
    output: { 
     path: './bundles', 
     filename: "[name].js" 
    }, 
    // SETS UP THE REFERENCE TO THE DLL 
    plugins: [ 
     new MyDllReferencePlugin({ 
      context: '.', 
      // IMPORTANT LINE, AND WHERE EVERYTHING SEEMS TO FAIL 
      manifest: path.resolve('./bundles/my_dll-manifest.json') 
     }) 
    ] 
}; 
+0

Bitte versuchen Sie zu vermeiden, nur Code als Antwort zu verlieren und versuchen zu erklären, was es macht und warum. Ihr Code ist möglicherweise nicht offensichtlich für Personen, die nicht über die entsprechende Codiererfahrung verfügen. – Frits

+0

Danke! Du bist ein Lebensretter. – zjm555