Webpack/react hot reload Nachladen der ganzen Seite?

Question

Dies wird wahrscheinlich die ganze Zeit gefragt, aber ich habe jeden Ansatz unter der Sonne versucht und kann keine Lösung finden.

I've created a repo to make it easier to get help. Sie können es klonen, führen Sie npm install und dann npm start:dev, um einen schnellen lokalen Server unter http://localhost:8080 anzuzeigen.

Es funktioniert, und wenn ich eine Datei ändern (z. B. src/components/Note/Note.css) wird die App neu geladen. Ich möchte jedoch nur die Komponente neu laden, nicht die ganze Seite. Ich bin mir nicht sicher, was ich falsch mache. Jede Hilfe wird geschätzt!

Answer 1

Um Probleme wie diese zu debuggen, aktivieren Sie "Protokoll beibehalten" in den Chrome DevTools-Konsoleneinstellungen, um das Protokoll der Konsole über die Seitenaktualisierung hinweg zu erhalten.

Der Fehler war:

Uncaught RangeError: Maximum call stack size exceeded 

Dies wurde behoben, sobald die folgenden Änderungen vorgenommen wurden:

1. entfernen new webpack.HotModuleReplacementPlugin() von Plugins (als webpack-dev-Server mit --hot gestartet wird)

2. Deaktivieren Sie auch Babel ES6-Module durch Aktualisierung presets in .babelrc zu ["react", ["env", { "modules": false }]].

"modules": false ist babel zu sagen, nicht-Import/Export und lassen webpack handhaben, es zu kompilieren als here und here beschrieben (Schritt 3.3.c Überprüfen).