Praktischer Fall des Backend-Systems Vue.js 2.0

Dieses Mal werde ich Ihnen einen praktischen Fall des Vue.js 2.0-Backend-Systems vorstellen. Was sind die Vorsichtsmaßnahmen für die tatsächliche Verwendung des Vue.js 2.0-Backend-Systems? , lass uns einen Blick darauf werfen.

Mein Freund wollte vor Kurzem ein OA für sich selbst machen, um seine Fähigkeiten zu üben (PS, er wollte schon immer ein Unternehmen gründen), also hat er mich gebeten, es schon seit einiger Zeit mit ihm zu machen ist in letzter Zeit begrenzt, ich habe ihm geholfen, ein Framework für sich selbst zu schreiben.

Ich verwende Garn, um das Projekt zu verwalten (wird eigentlich nicht dem Trend folgen), natürlich können Sie auch Npm-Management verwenden

Verwenden Sie zuerst vue-clium das Projekt zu initialisieren , und installieren Sie dann das Vue-Router-Vuex-Element. Da mein Freund noch nie Front-End-Arbeit geleistet hat, habe ich Element ausgewählt, um die Seite schnell zu entwickeln. Nach der Installation aller Abhängigkeiten sieht die Verzeichnisstruktur wie folgt aus:

Verzeichnisstruktur

Hier ist zu beachten, dass jede meiner Komponenten ein Ordner ist, der aus Indexen besteht. vue script.js style.sass template.jade-Datei, die bequem im -Editor formatiert werden kann. Wenn sich auf bezieht, müssen Sie nur den Ordner

e.g.
import NotFound from './views/404';
index.vue
<style lang="sass" scoped src="./style.sass"></style><template lang="jade" src="./template.pug"></template><script src="./script.js"></script>
script.js
export default {  data() {    return {    }  },  components: {  }}
sass
.red  color: red

angeben

Da das vom vue-cli-Webpack generierte Projekt kein Jade verwendet, müssen Sie den Jade-Loader des Webpacks selbst hinzufügen

Beachten Sie, dass Sie den Pug-HTML-Loader-Jade installieren müssen

...
     {        test: /\.pug$/,
        loader: 'vue-html!pug-html'
      },
...

Sass-Unterstützung derzeit

Um Sass zu unterstützen, müssen Sie den Sass-Loader Node-Sass installieren

Vue-RessourceIch habe es installiert und Port Ich habe mich noch nicht für die Verwendung von Ajax entschieden. Wenn ich Ajax verwende, werde ich die Bibliothek verwenden

Das Projekt hier bezieht sich auf den besten praktischen Prozess zum Erstellen einer Einzelseitenanwendung mit vue2.0 , also sind die Funktionen der Beispiele die gleichen ~

Bitte Star github

Ich glaube, Sie beherrschen die Methode in diesem Artikel zu anderen verwandten Artikeln auf der chinesischen PHP-Website!

Verwandte Lektüre:

js-Wissen über organisierte Stücklistenvorgänge

10 js reguläre AusdrückeAnwendungsbeispiele

Das obige ist der detaillierte Inhalt vonPraktischer Fall des Backend-Systems Vue.js 2.0. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!