Hallo zusammen,
Ich bin aktuell dabei, Vue 3 für ein neues Projekt zusammen mit Contao zu nutzen.
Hierfür habe ich in mein fe_page.html5 Template, direkt nach dem öffnenden <body> ein <div id="app"> eingefügt - hierauf wird meine Vue 3 root Instanz gemounted, sämtllicher von Contao generierte Content befindet sich innerhalb dieses <div>'s.
Der Vorteil dabei ist, dass ich nun diverse Vue-Komponenten bereitstellen kann, die ein Backend-User ebenfalls einfach einbinden kann (im einfachsten Fall in Form eines HTML ContentElements).
Nun habe ich aber das Problem, dass sämtliche <script> Blöcke, die Contao z.B. mit diversen ContentElementen innerhalb des Contents einfügt, von Vue mit einer Warnung quittiert werden (weil diese sich wohl im Scope meiner Vue 3 root Instanz befinden).
Daher habe ich über einen Contao Hook alle <script> Blöcke gesammelt, und hänge diese außerhalb meines <div id="app"> wieder an - das funktioniert oft, aber auch nicht in jedem Fall.
Gibt es hier jemanden, der mir ein "BestPractice" hat, wie ich Contao 4 mit Vue 4 erweitern kann, OHNE alle Contao spezifischen / Plugin spezifischen Scripte mit Vue-Code ersetzen zu müssen.
Die Vue-Komponenten kommunizieren auch miteinander, daher wäre es vermutlich keine Option mehrere Vue Instanzen getrennt zu erstellen.
Eventuell kann man Vue auch dazu bringen, nur registrierte Vue Komponenten zu verarbeiten und alles andere zu ignorieren?
Ich hoffe es ist klar geworden, was mein Problem ist - sonst gerne nachfragen.
Vielen Dank für eure Hilfe,
Steffen
Lesezeichen