Beste Möglichkeit, Vue mit Express zu verwenden?

1: Ich habe installiert expressjs. 2: Ich installierte Rahmen vue mit npm vue installieren --save 3: Früher habe ich Lenker als Template-Engine für Express.jsBeste Möglichkeit, Vue mit Express zu verwenden?

Danach in index.hbs dieser Code:

<h1>{{title}}</h1> 
<p>Welcome to {{title}}</p> 
<p>\{{title2}}</p> 
<script> 
    new Vue({ 
     el: "#app", 
     data: { 
      title2: "Hello World" 
     } 
    }); 
</script>

Jetzt wollte ich vue zu benutzen, um dieses Skript auszuführen, aber etwas in layout.hbs Ich habe es versucht, aber ich weiß nicht, wie man vue einfügt, also habe ich einfach vue von cdnjs hinzugefügt.

Es gab auch ein Problem, das ich hinzugefügt habe, dass in Kopf konnte nicht in Körperende enthalten, weil Vorlage Rendern von HBs Skript nicht ausgeführt.

Nun ist die zweite Sache, wenn ich vue in users.hbs verwenden möchte, muss ich Vue Instance erneut erstellen und das mit weiteren kommenden Seiten fortfahren.

Es Code wiederholen und sehr schwierig zu verwalten.

Also irgendwie? Ich muss nicht jedes Mal Instanz erstellen, und ich brauche kein Skript in Kopf-Tag von CDN enthalten?

Sorry für diese vergessen, wenn ich Vue neue Instanz in app.js dann fügen Sie diese Warnung ist:

[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build. 
(found in <Root>)

Dies ist layout.hbs

<!DOCTYPE html> 
<html> 
    <head> 
    <title>{{title}}</title> 
    <link rel='stylesheet' href='/stylesheets/style.css' /> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.2/vue.min.js"></script> 
    </head> 
    <body> 
    <div id="app"> 
     {{{body}}} 
    </div> 
    </body> 
</html>

Dank

Quelle

2017-03-12 Earon

Bitte beachten Sie, dass die Verwendung von Bundlern wie Webpack in modernen JS-Frameworks üblich ist. –

Also dann denke ich, Vue-cli besten Weg richtig? aber ich weiß auch nicht, wie man mit dem express verwendet :) – Earon

Sobald Sie Ihre Webpack-Paket-Setup haben, können Sie Express (und alles andere, was Ihr Projekt benötigt) von npm: https://www.npmjs.com/package ziehen/Express dann importieren Sie es in Ihr Projekt. –

FÜR SSR Ich würde vorschlagen, NUXT.js zu verwenden, denn sie haben ein integriertes System mit Express bereits installiert. Verwenden Sie Axios für HTTP-Anfragen.

Für CSR Ich würde vorschlagen, 2 Projekte separat zu erstellen, in 1 Sie haben vuejs und in einem anderen nodejs. Dann lassen Sie sie über Axios kommunizieren, zu diesem Zweck können Sie EXPRESS oder RESTIFY verwenden.

Quelle

2017-03-12 12:25:30 Stan

Ich hatte die gleiche Frage und stolperte über diese Frage, bevor ich selbst eine Lösung machte.

Am Ende ging ich mit der Standard-Express-Generator-App + ein Build-Skript, um .vue-Dateien in ein Bündel zu konvertieren, so dass ich sie in meinen Ansichtsdateien verwenden kann.

schrieb ich einen kleinen Beitrag zu den Maßnahmen zu ergreifen: https://mindthecode.com/using-vue-components-in-your-express-app/

Hoffe, dass es jemand hilft.

Quelle

2017-10-16 09:48:05 Hyra

Beste Möglichkeit, Vue mit Express zu verwenden?

Antwort

Verwandte Themen