Webpack dev-server hot-Modus funktioniert nicht

Hier meine config:

devServer: {
    contentBase: '/web/dist/',
    hot: true,
    stats: {colors: true},
    inline: true
}

Und hier ist die gulp-task im Betrieb:

gulp.task('build', ['clean', 'styles', 'bower', 'media', 'data', 'homepage'], function(done) {
    es6promise.polyfill();

    console.log('STARTING DEV SERVER...');

    server = new WebpackDevServer(webpack(webpackDevConfig), webpackDevConfig.devServer);
    server.listen(8080, '0.0.0.0', function (err, stats) {
        if (err) {
             throw new gutil.PluginError("webpack-dev-server", err);
        }

        console.log('DEV SERVER STARTED');

        done();
    });
});

Funktioniert alles wie erwartet, außer der heiße laden (kein aktualisieren oder zu ändern, wenn ich änderungen an Dateien). Was mache ich hier falsch?

InformationsquelleAutor Evan | 2015-05-28
  1. 7

    Müssen Sie <script src="http://localhost:8080/webpack-dev-server.js"></script> zu Ihrem index.html Es wird nicht Hinzugefügt, wenn Sie die API verwenden,

    "Beachten Sie, dass webpack-Konfiguration wird nicht an WebpackDevServer API, so devServer option in der webpack-Konfiguration ist in diesem Fall nicht verwendet. Es gibt auch keine inline-Modus für WebpackDevServer API. <script src="http://localhost:8080/webpack-dev-server.js"></script> sollte eingefügt werden, um die HTML-Seite manuell ein."
    (http://webpack.github.io/docs/webpack-dev-server.html)

    vielleicht müssen Sie auch hinzufügen 'webpack/hot/dev-server' als entrypoint zu Ihrem webpack config

    • ich sehe das in der Konsole: [WDS] Hot-Modul-Austausch aktiviert. Rahmen.bundle.js:114 Uncaught Error: [HMR] Hot-Modul-Ersatz ist deaktiviert.
    • hmm hast du plugins: [new webpack.HotModuleReplacementPlugin()] Hinzugefügt in Ihrem webpack config?
    • okay, das schien zu helfen, aber jetzt ist es einfach nicht auf geänderte Dateien. [WDS] Hot-Modul-Austausch aktiviert. Rahmen.bundle.js:600 [HMR] Warten für das update-signal von WDS... ändern, Dateien und es passiert nichts
    • muss ich diese publicPath option? was genau ist der publicPath zeigen soll, zu?
    • Ich glaube nicht, dass Sie brauchen, von einem öffentlichen Weg aus diesem. Sollte es zur Auslieferung statischer Inhalte. Sonst habe ich keine Idee. Vielleicht können Sie Ihre webpack.config auf die Frage...
    • Ich bin auch mit docker und ich denke, dass ist das problem. stackoverflow.com/questions/30212372/.... Ich werde markieren Sie diese als angenommen, aber da es funktioniert, wenn ich die trigger eine änderung der docker-container manuell.

    InformationsquelleAutor errnesto
  2. 1

    stellen 

    webpackConfig.plugins.push(new webpack.HotModuleReplacementPlugin());

    in der webpackConfig sowie

    InformationsquelleAutor Elise Chant
  3. 0

    Wenn Sie mit redux können versuchen, diese.

    Für einige zufällige Grund redux-devtools war nicht so hot reload für mich. Versuchen Sie, es von der Wurzel-Komponente und redux compose config.

    Hinweis: Verwenden redux devtool browser-Erweiterung, die mit dieser config in Ihrem Shop-Konfiguration: window.devToolsExtension ? window.devToolsExtension() : f => f

    Auch, muss Lesen: https://medium.com/@rajaraodv/webpacks-hmr-react-hot-loader-the-missing-manual-232336dc0d96#.ejpsmve8f

    Oder probieren Sie hot reload 3:
    Beispiel: https://github.com/gaearon/redux-devtools/commit/64f58b7010a1b2a71ad16716eb37ac1031f93915

    InformationsquelleAutor Priyanshu Chauhan
Schreibe einen Kommentar