2017-05-20 1 views
2

Guten Tag, alle.React + webpack + reaktiv-hot-loader dynamisch json laden in Tabelle in der Produktion

Ich habe einfache App mit React + Webpack2 + Reagieren-Hot-Loader, die Datentabelle aus JSON-Datei zeigt.

import Data from '../../src/data/last.json'; 

Und wenn ich „webpack-dev-Server“ alle Informationen zeigt, die von Tabelle ändert sich dynamisch ohne vollständige Aktualisierung der Seite zu starten, wenn „last.json“ mit einer anderen Anwendung überschreibt.

Ich verwende Beispiele aus GitHub react-hot-boilerplate und bereits WebPack off doc about HMR gelesen, die besagt, dass:

Die Hot Module Ersatz Funktionalität nicht für den Einsatz in der Produktion gedacht. Sie sollten es nur in Ihrer Entwicklungsumgebung verwenden.

Frage: Kann ich dieses Verhalten bei der Produktion mit Hot-Loader oder nur mit Ajax erreichen?

Oder muss ich Redux mit "wechselnden Speicher im laufenden Betrieb" am Back-End starten?
Jetzt verwende ich PHP-Back-End mit APIs auf React und ich dachte, es wird genug für meine Aufgaben sein. Liege ich falsch?

Antwort

2

Heißes Nachladen ist im Entwicklungsprozess aktuell, wo häufig Änderungen auftreten. Einzelseiten-Anwendung in der Produktion wird einmal geladen und auf der Client-Seite alle Zeit gearbeitet. Wenn Sie eine neue Version der Anwendung für die Produktion freigeben, müssen Sie das Signal irgendwie an die Client-Anwendung senden, um es neu zu laden. Die clientseitige Anwendung führt ein erneutes Laden durch, wenn dies für die Anwendungslogik geeignet ist.

Ihre JSON-Datei wird nach jeder Änderung neu in die Clientanwendung geladen, da der Webpack-Buildvorgang und das Warmladevorgang ausgeführt werden. Normalerweise fallen die Daten nicht über eine Datei von der Festplatte in die Anwendung, sondern als Antwort auf das Serverprogramm. Und Hot-Loading hat keine solche Möglichkeit, Anwendungsdaten zu übertragen. Ihre JSON-Datei wird als geänderte Quelldatei in die Anwendung eingefügt. Beim Warmladen wird Ihr JSON als Quelldatei betrachtet und nach Änderungen erneut in die Anwendung geladen.

Heiß nachladen ist Entwicklungsprozess. Es ist kein Anwendungsprozess.

+0

Also, die einzige Wahl, um dynamische Komponenten neu zu laden ohne vollständige Seitenaktualisierung in der Produktion zu erreichen - ist Flux/Redux mit den Speichern, richtig? – ANTVirGEO

+0

Sie haben nach json mit Daten gefragt. Wenn json statische Daten hat - Sie integrieren sie mit json loader in das Bundle (wie in Ihrem String-Codebeispiel). Wenn JSON-Inhalte dynamische Daten sind, muss Ihre Anwendung eine Anfrage an den Server für diese Daten durchführen. Jetzt fragt man nach der Code-Komponente - sie ist im Wesentlichen statisch und wird als Paket geladen. Wenn Sie die App für die neue Version freigeben, ist der Server möglicherweise erst dann inkompatibel mit der vorherigen Client-App, wenn alle Client-Apps vollständig neu geladen wurden, um mit dem neuen Servercode kompatibel zu sein. – oklas

+0

Der Fluss/Redux ist Anwendungszustand Managent Ansätze. Was zu verwenden ist Ihre Wahl. Anwendungsstatuselemente können dem Serverstatus zugeordnet sein oder nicht. Ihre Komponenten sollen den Anwendungsstatus widerspiegeln. – oklas

Verwandte Themen