webpack 2 aussetzen Webworker als globale

Question

Ich versuche, für eine Reaktion/Redux App-Tests zu schreiben, und wir haben eine Reihe von Webworker, die derzeit über require('worker-loader?inline!downloadTrackWorker')

importiert Ich habe zu Figur versucht, im Kreis heraus, wie man diesen Code trennt, damit ich Tests in node.js ausführen kann, ohne Probleme beim Laden des Webworker zu haben.

Eine Lösung, die ich gefunden habe, war, den Webworker global in meinem Webpack verfügbar zu machen, was bedeuten würde, dass ich in meinen Tests einen Stub oder einen Mock definieren könnte.

In meinem webpack Config, ich habe hinzugefügt

module: { 
    loaders: [...], 
    rules: [{ 
     test: require.resolve(APP_DIR + '/helpers/downloadTrackWorkerLoader'), 
     loader: 'expose-loader', 
     options: 'DownloadTrackWorker' 
    }] 
} 

mein trackWorkerLoader ist einfach

const DownloadTrackWorker = require('worker-loader?inline!./downloadTrackWorker.js'); 

module.export = DownloadTrackWorker; 

Ich habe auch versucht, die oben ohne inline, aber kein Glück.

Ich habe zwei Probleme.

1. , wenn ich für DownloadTrackWorker in meiner Konsole sehen, es ist nicht definiert

2. mit meinem aktualisiert webpack.config, erhalte ich eine Fehlermeldung, dass webpack nicht may need appropriate loader bei

   ReactDOM.render(
       <Provider store={store}> 
       <Player /> 
       </Provider>, 
       document.getElementById('root') 
   ); 
   

analysieren kann

Irgendwelche Vorschläge, was ich falsch mache? Es scheint mir, dass die Probleme, die ich sehe, verwandt sind.

Answer 1

, wenn ich für DownloadTrackWorker in meiner Konsole aussehen, es

Da die expose-loader Noten in Readme - Usage nicht definiert ist, müssen Sie es importieren, um in dem Bündel enthalten zu sein und daher ausgesetzt. Die Regeln enthalten nichts, sondern gelten für die Importe in Ihrer App, die den Test erfüllen. Außerdem wird der Loader nicht auf die richtige Datei angewendet. Sie wollen würde die expose-loader-trackWorkerLoader.js, so dass die richtige Regel gelten:

{ 
    test: require.resolve(APP_DIR + '/helpers/trackWorkerLoader'), 
    loader: 'expose-loader', 
    options: 'DownloadTrackWorker' 
} 

Jetzt können Sie es irgendwo in der App importieren müssen mit:

require('./path/to/helpers/trackWorkerLoader'); 

Diese korrekt DownloadTrackWorker als globales aussetzen Variable, aber Sie haben einen Tippfehler in trackWorkerLoader.js anstelle von module.exports Sie haben module.export. Momentan exportierst du eigentlich nichts.Es sollte sein:

module.exports = DownloadTrackWorker; 

Statt inlining die worker-loader im require (nicht über seine Option im Gespräch) Sie können auch sie in der Regel definieren:

{ 
    test: require.resolve(APP_DIR + '/helpers/downloadTrackWorker'), 
    loader: 'worker-loader', 
    options: { 
     inline: true 
    } 
} 

Und jetzt können Sie einfach verlangen, ohne benötigen, um die Lader in trackWorkerLoader.js angeben:

const DownloadTrackWorker = require('./downloadTrackWorker'); 

module.exports = DownloadTrackWorker; 

mit meinem aktualisiert webpack .config, erhalte ich einen Fehler, der webpack nicht

Sie definieren sowohl module.loaders und module.rules zugleich geeigneten Lader müssen analysieren. Obwohl module.loaders aus Kompatibilitätsgründen noch vorhanden ist, wird es vollständig ignoriert, wenn module.rules vorhanden ist. Daher werden die Loader, die Sie zuvor konfiguriert haben, nicht angewendet. Verschieben Sie einfach alle Regeln auf module.rules.