VueJS buil große App-Architektur

Question

Ich benutzte VueJs für kleine Einseitenanwendung oder für kleine Komponenten. Aber jetzt versuche ich das gesamte Frontend einer App mit VueJS zu bauen.

Und ich hatte einige Probleme mit der Architektur meines Projekts.

Soll ich für jede Seite eine Komponente erstellen? (Wie im vue Router doc) wie: HomePage, ArticlePage, LoginPage, ContactPage usw.

Aber wie kann ich meinen Komponentenordner mit so vielen Komponenten organisieren? Und ich frage mich, ob es eine typische Architektur für große App VueJs gibt?

Hier ist meine Architektur für mein VueJS Projekt:

Answer 1

Diese Struktur ist in Ordnung, und ich denke, man es in src/ haben. Die Strukturen sind immer etwas sehr Subjektives, also gibt es keinen perfekten Weg. Sie sind derjenige, der damit umgehen wird, also sollten Sie es als bequemer haben.

Ich benutze auch einen Ordner namens Direktiven, einen anderen für Plugins und einen anderen für Ansichten, wo ich den Inhalt "Seiten".

Beispiel:

├ assets 
├ components 
│ ├ alerts.vue 
│ └ menu.vue 
├ directives 
│ └ datepicker.vue 
├ plugins 
│ ├ auth.js 
│ └ alerts.js 
├ views 
│ ├ home.vue 
│ └ users 
│ ├ edit.vue 
│ └ list.vue 
├─ App.vue 
└─ main.js 

auch nicht versuchen, die Vermögenswerte Ordner verwechseln, weil die eine Innen src/ ist eine, die proccessed wird. Für allgemeine Assets, die nicht verarbeitet werden müssen, oder Sie sie nicht packen möchten, platzieren Sie sie stattdessen im Ordner static/.

Answer 2

Sie sollten mehr Ordner und Unterordner zur Klassifizierung der Architektur machen.

Ich teile meine aktuelle Verwendung dieses Ansatzes, es ist mehr wiederverwendbar und bevorzugen Sie sind in einem mehr als ein Mann entwickeln Team.

Absolut geeignet für große Anwendungen. Es enthält 3 Teile.

Part 1, Part 2, Part 3