Vorkompilierte Einzelseiten-Apps in Phoenix App

8

Ich habe eine vorkompilierte ember.js-App (welches fronted-js-framework hier keine Rolle spielt), die im Wesentlichen aus einem Ordner mit einer index.html-Datei und ein paar js / css-Assets besteht.

Ich habe diesen Ordner unter / priv / static in meiner phoenix-App platziert und versucht, den Router dazu zu bringen, ihn zu bedienen ... bisher ohne Erfolg. Ich bin auf Phoenix Version 0.17.1 (wie 1.0 afaik). Ich habe die folgenden Schritte in dieser Reihenfolge versucht:

  • In endpoint.ex habe ich den only: ~w(...) Filter entfernt.
  • Implementiert einen minimalen Controller mit einer einzigen Aktion, um die Datei zu bedienen: %Code%
  • hat den Controller zu meinen routes.ex hinzugefügt: %Code%

Keiner der obigen Schritte hat bisher funktioniert, ich erhalte nur den Fehler def index(conn, _params) do redirect conn, to: "/my_app/index.html" end . Wie kann ich dieses Problem lösen? Ich möchte nur die URL get "/my_app", MyCustomController, :index (oder, wenn nichts anderes funktioniert, no route found for GET /my_app/index.html ) auf den Pfad "/my_app" innerhalb meiner Phönix App abbilden. Irgendwelche Ideen?

BEARBEITEN :

Der grundlegende Workflow, den ich zu implementieren versuche, ist folgender:

Ich habe verschiedene Entwickler, die einige SPAs von ember.js in ihrem eigenen Ordner in "/my_app/index.html" erstellen. Also habe ich einen Entwickler, der priv/static/my_app/index.html mit ember und ember-cli erstellt. Dieser Entwickler verwendet $phoenix_root/apps/ beim Entwickeln seiner App und lässt $phoenix_root/apps/my_app im Hintergrund laufen, da die phoenix App selbst die benötigten Daten als RESTful API zur Verfügung stellt.

Nach jeder implementierten Funktion gibt der Frontend-Entwickler ember server ein, diese Aufgabe kompiliert die gesamte Frontend-App ember.js in einen einzigen Ordner mit einer index.html-Datei und einigen Assets und verschiebt diesen Ordner nach mix phoenix.server . Dann löst Phönix (oder Brunch) aus und kopiert dieses Zeug wie es ist nach ember build [...] , bereit, wie jedes andere Gut zu dienen.

Der Punkt ist, in der Lage zu sein, eine Reihe von isolierten "Frontends" als eigenständige Pakete innerhalb einer einzigen Code-Basis (der Phoenix App) zu erstellen, während die Phoenix App selbst zusätzliche (andere) Dinge zu tun hat.

Da die Frontend-Entwickler das SPA jedesmal automatisch generieren, ist es etwas, das ich sehr vermeiden möchte, die immer neue index.html-Datei zu ändern. Leistungsmäßig wäre es am besten, diese SPAs nur als statische Dateien zu verwenden - sie initialisieren sie selbst im Browser des Benutzers.

Ich hoffe, das bringt eine Klarstellung, warum ich das tue.

EDIT 2:

Ich habe jetzt eine funktionierende Lösung, siehe das Beispiel-Repo, das ich zu Demonstrationszwecken erstellt habe: Ссылка

Notwendige Änderungen an der Phoenix-App:

  • Ändern Sie $phoenix_root/web/static/assets/my_app ' $phoenix_root/priv/static/my_app , um die SPAs und ihre Assets einzubeziehen.
  • Neustart endpoint.ex danach!

Notwendige Änderungen an den ember.js Apps:

  • Fügen Sie Plug.Static zu mix phoenix.server hinzu, um so "output-path": "../../web/static/assets/*my_app*/" immer mit diesem Pfad
  • auszuführen
  • add .ember-cli und ember build zu baseURL: '/*my_app*/'
  • locationType: 'none' , wenn der gesamte Code in einem einzelnen Projekt versioniert werden soll (Zweck dieser Frage)
Hisako 04.09.2015, 22:39
quelle

2 Antworten

3

Dein Setup sollte einfach funktionieren. Es gibt nur eine Einschränkung: Jedes Mal, wenn Sie etwas in lib ändern, müssen Sie Ihre Anwendung neu starten.

Das einzige Verzeichnis, in dem Code bei Anfragen neu geladen wird, ist web . In der Tat ist das der einzige Unterschied zwischen den Verzeichnissen lib und web . Aus diesem Grund legen Sie lange laufende Prozesse und Supervisor in lib ab, da kein Code neu geladen werden muss, und alles andere geht in web .

    
José Valim 09.09.2015, 12:34
quelle
2

Ich denke, der einfachste Weg, web/templates/layout/app.html.eex mit Ihrem Index html zu ersetzen und den Pfad zu Assets innerhalb mit <%= static_path(@conn, "/js/app.js") %> helpers zu ändern, um die js-Datei Ihrer Ember-App aus dem statischen Ordner zu übernehmen.

Router Teil:

%Vor%

Und die interne Aktion render conn .

    
Igor Kapkov 05.09.2015 00:13
quelle