Auswahl webpack dll Bündel über Oszilloskopbetrieb

Question

In den webpack Beispiele, insbesondere

• https://github.com/webpack/webpack/tree/master/examples/dll
• https://github.com/webpack/webpack/tree/master/examples/dll-user

Wir ein Bündel erstellen können, die auf bereits vorge gebündelten Bibliotheken abhängt. Die vorliegenden Beispiele funktionieren so, wie sie sollten. Das heißt, wir navigieren zuerst zu examples/dll und führen node build.js aus, um die Bibliotheken zu erstellen. Dann navigieren wir zu examples/dll-user und führen node build.js aus, um unsere endgültigen Bundles zu erstellen, die auf die zuvor gebündelten Bibliotheken verweisen.

Meine Frage ist die folgende. Nehmen wir an, in examples/dll wir die Konfigurationsdatei ändern, um wie folgt aussehen:

var path = require("path"); 
var webpack = require("../../"); 
module.exports = { 
    entry: { 
     alpha: ["./alpha", "./a", "module"], 
     beta: ["./beta", "./b", "module"] 
    }, 
    output: { 
     path: path.join(__dirname, "js"), 
     filename: "MyDll.[name].js", 
     library: "[name]_[hash]" 
    }, 
    plugins: [ 
     new webpack.DllPlugin({ 
      path: path.join(__dirname, "js", "[name]-manifest.json"), 
      name: "[name]_[hash]" 
     }) 
    ] 
}; 

Das heißt, wir module zum beta dll hinzugefügt. Jetzt müssen wir dlls haben module. Lassen Sie uns die DLLs kompilieren und gehen Sie weiter zu dll-user Beispiel. Hier möchten wir ein Paket erstellen, aus dem wir die Bibliothek auswählen können, die module bereitstellt. Versuchen wir zum Beispiel eine weitere Zeile hinzufügen

console.log(require("../dll/alpha")); 
console.log(require("../dll/a")); 

console.log(require("beta/beta")); 
console.log(require("beta/b")); 

console.log(require("module")); 
console.log(require("beta/module")); 

In diesem Fall möchte ich die module verwenden können, die in der beta DLL befindet. Leider hatte ich kein Glück. Dies ist die Ausgabe, die ich nach dem Ausprobieren erhalten habe:

jmlopez in ~/Downloads/webpack-master/examples/dll-user$ node build.js 
{ [Error: Command failed: /bin/sh -c node ../../bin/webpack.js --display-reasons --display-chunks --display-modules --display-origins --output-public-path "js/" -p ./example.js js/output.js 
] 
    killed: false, 
    code: 2, 
    signal: null, 
    cmd: '/bin/sh -c node ../../bin/webpack.js --display-reasons --display-chunks --display-modules --display-origins --output-public-path "js/" -p ./example.js js/output.js' } 
Hash: bd42dda7e56ebfd7cd32 
Version: webpack 2.1.0-beta.6 
Time: 68ms 
    Asset  Size Chunks    Chunk Names 
output.js 4.26 kB  0 [emitted] main 
chunk {0} output.js (main) 504 bytes [rendered] 
    > main [7] ./example.js 
    [7] ./example.js 210 bytes {0} [built] [1 error] 
    + 7 hidden modules 

ERROR in ./example.js 
Module not found: Error: Can't resolve 'beta/module' in '/Users/jmlopez/Downloads/webpack-master/examples/dll-user' 
@ ./example.js 8:12-34 

{ [Error: Command failed: /bin/sh -c node ../../bin/webpack.js --display-reasons --display-chunks --display-modules --display-origins --output-public-path "js/" --output-pathinfo ./example.js js/output.js 
] 
    killed: false, 
    code: 2, 
    signal: null, 
    cmd: '/bin/sh -c node ../../bin/webpack.js --display-reasons --display-chunks --display-modules --display-origins --output-public-path "js/" --output-pathinfo ./example.js js/output.js' } 

Gibt es eine Möglichkeit, die Bibliothek anzugeben, die das Bundle verwenden soll? Ich dachte, die scope Option in DllReferencePlugin würde den Trick tun, aber es scheint nicht der Fall zu sein.

EDIT: Beachten Sie, dass das Hinzufügen von ./a zu der Beta-DLL und dann require('beta/a') im Beispiel funktioniert. Es scheint, dass es für Webpack schwierig ist, die node_module herauszufinden.

Answer 1

Ich hatte ein ähnliches Problem beim Erstellen meiner DLL mit einem Modul von NPM. Die Lösung für mich bestand darin, den vollständigen Pfad vom Manifest zu referenzieren, nicht nur den Modulnamen.

index.js - Modul mit dem DLL

var angular = require('alpha/node_modules/angular-wrapper/lib/index'); require('alpha/node_modules/angular-ui-router/release/angular-ui-router');

Macht des erfordert in dem Projekt der DLL sehen ein bisschen hässlich verwenden, aber es funktioniert.

webpack.conf - Modul die DLL mit

new webpack.DllReferencePlugin({ scope: 'alpha', context: path.join(__dirname,'./node_modules/@company/ng1dll/dist/'), manifest: require('./node_modules/@company/ng1dll/dist/angular-manifest.json') })

Hinweis: Ich lade mein Modul über ein privates NPM-Paket.

webpack.conf - DLL Schaffung

module.exports = { 
    entry: { 
     beta: ["./beta", "./b"], 
     angular: ['angular-wrapper','angular-ui-router'] 
    }, 
    output: { 
     path: path.join(__dirname, "dist"), 
     filename: "[name].js", 
     library: "[name]_lib" 

    }, 
    plugins: [ 
     new webpack.DllPlugin({ 
      path: path.join(__dirname, "dist", "[name]-manifest.json"), 
      name: "[name]_lib" 
     }) 
    ] 
} 

manifest.json

{ 
    "name": "angular_lib", 
    "content": { 
    "./node_modules/angular-wrapper/lib/index.js": 1, 
    "./node_modules/angular-wrapper/node_modules/angular/index.js": 2, 
    "./node_modules/angular-wrapper/node_modules/angular/angular.js": 3, 
    "./node_modules/angular-ui-router/release/angular-ui-router.js": 4 
    } 
}