Razzle: Wie wende ich Razzle auf ein bestehendes Projekt an?

Ich mache das jetzt selbst durch.
Ich hatte das CRA-Projekt auf folgende Weise eingerichtet:

/projects/my-cra-app
Darunter habe ich dann src , node_modules und alles andere, was CRA erstellt hat.

Ich konnte keinen Weg finden, Razzle darin zu mischen (und zuerst dachte ich, dass Razzle CRA ersetzen würde und tatsächlich Client-Rendering (Port 3001) und Server-Rendering (Port 3000) aus demselben Projekt bedienen könnte. Aber das hat auch nicht funktioniert (ich habe früher hier eine Frage dazu gepostet, aber keine Antworten).
Außerdem verwende ich Razzle Latest (Alpha) mit Webpack4, während CRA immer noch Webpack (3) ist, obwohl einige anfängliche Commits für Webpack 4 jetzt auf ihrem Master-Zweig gelandet sind ...

Also was ich jetzt gemacht habe, war folgendes

/projects/my-app/app.src
/projects/my-app/app-cra mit node_modules (mit ./src/ mit cra-generierter App.js App.css)
/projects/my-app/app-ssr, das node_modules enthält (mit ./src/, das von Razzle generiertes Zeug enthält)

dann enthält app-cra/src auch einen symbolischen Link zu ../../app.src
und app-ssr/src enthält auch einen symbolischen Link zu ../../app.src

Auf diese Weise kann ich dieselbe Quelle, aber unterschiedliche Einstiegspunktskripte und unterschiedliche node_modules zwischen Razzle und Cra teilen.

Leider wird Razzle Ihr JS nicht direkt aus den Symlink-Verzeichnissen transplizieren/kompilieren (cRA übrigens auch nicht).

Also verwende ich rewire für CRA und razle-config.js, um beide anzuweisen, sich meine JS-Dateien in den symbolisch verknüpften Verzeichnissen anzusehen.

Wenn Sie razle-config.js auswählen möchten, das ich jetzt habe, können Sie es hier auf Stack-Overflow sehen (da ich auf ein Problem mit einer der Bibliotheken stoße, die ich für SSR verwenden möchte. . also suche nach Hilfe zum Stack-Overflow dafür ).

Es ist ein bisschen kompliziert, weil ich mehr als Standard-Razzle mache (React-Native-Web, React-Vector-Icons, Sass, symbolverlinkte Verzeichnisse ..., einige ausgewählte node_modules-Module transpliziere, weil ihre Autoren beschlossen haben, sie nicht für das Web bereitzustellen. Einsätze usw.)

https://stackoverflow.com/questions/50514135/error-in-react-native-vector-icons-when-using-for-web-server-side-rendering

Hm, danke für deine Antwort. Verstehe immer noch nicht wie man das macht

@ifndefdeadmau5 behalte deine CRA-App.

a) Erstellen Sie eine weitere neue App mit create-razzle-app auf derselben Ordnerebene in Ihrer CRA-App.

b) Verschieben Sie die Dateien, die Sie zwischen den beiden Apps teilen möchten, in einen gemeinsamen Ordner.

c) Erstellen Sie symbolische Links aus dem src-Verzeichnis der beiden Apps, die auf den Ordner zeigen, den Sie in b) erstellt haben.

d) Verwenden Sie razzle-config.js und rewire (für die CRA-App), um das Webpack anzuweisen, die JS-Dateien in die in Schritt c) erstellten Symlinks zu transplizieren.

Ich konnte keinen anderen Weg finden, ja, also haben andere vielleicht bessere Antworten ...

@jaredpalmer Hallo, könnten Sie eine Lösung für die Migration von CRA zur Razzle-Server-Rendering-App bereitstellen und das zugehörige Dokument in der Readme-Datei aktualisieren? Vielen Dank im Voraus.

Hallo! Also hier ist der Deal, zwischen Open Source und meinem Job und Leben und was nicht, ich habe eine Menge zu verwalten, also benutze ich einen GitHub-Bot, um hier und da ein paar Dinge zu automatisieren. Dieser spezielle GitHub-Bot wird dies als veraltet markieren, da er seit einiger Zeit keine Aktivitäten mehr hatte. Es wird geschlossen, wenn in einigen Tagen keine weiteren Aktivitäten stattfinden. Nehmen Sie dies nicht persönlich – ernsthaft – dies ist eine vollständig automatisierte Aktion. Wenn dies ein Fehler ist, machen Sie einfach einen Kommentar, senden Sie mir eine DM, senden Sie eine Brieftaube oder ein Rauchzeichen.

ProBot hat dies aufgrund von Inaktivität automatisch geschlossen. Holler, wenn dies ein Fehler ist, und wir werden es wieder öffnen.

Ich habe dieselbe Frage. Ich habe eine benutzerdefinierte React App erstellt. Wie kann ich Razzle darin integrieren?

Gibt es hierzu Neuigkeiten?

Ich habe die gleiche Frage, es sollte einige Tutorials dazu geben.

irgendwelche Fortschritte damit?

Ich habe auch Probleme damit. Ich hatte eine perfekt funktionierende CRA-App und versuchte, zu Razzle zu migrieren, indem ich index.tsx in client.tsx umbenannte und einen Server zu index.ts hinzufügte, aber wenn ich razzle start ausführe Es scheint, als würde es versuchen, Servercode mit dem Client zu bündeln, und Fehler wie ausgeben

These dependencies were not found:

* fs in ../.yarn/$$virtual/babel-plugin-styled-components-virtual-cfb9253662/0/cache/babel-plugin-styled-components-npm-1.11.1-9e78975a1c-4b545bed54.zip/node_modules/babel-plugin-styled-components/lib/visitors/displayNameAndId.js, ../.yarn/cache/cosmiconfig-npm-6.0.0-cb7d64a2b9-bbd6bbaefe.zip/node_modules/cosmiconfig/dist/readFile.js and 4 others
* module in ../.yarn/cache/resolve-patch-af4189aea7-9e62d2803a.zip/node_modules/resolve/lib/normalize-options.js, ../.yarn/cache/resolve-from-npm-4.0.0-f758ec21bf-87a4357c0c.zip/node_modules/resolve-from/index.js

Hatte jemand das gleiche oder hat eine Idee wie man das beheben kann?