Projekthintergrund
Der Hintergrund des Projekts ist, dass bei Outsourcing-Unternehmen für die Website-Erstellung im Designprozess eine große Anzahl wiederverwendbarer Komponenten anfällt. Oft müssen Designer die Komponenten nur noch feinabstimmen, um die Seite zusammenzusetzen und an die Front zu bringen Theoretisch können diese Komponenten auch im Frontend wiederverwendet werden, aber tatsächlich muss das Frontend jedes Mal die gesamte Seite neu implementieren, was viel Arbeitskraft verschwendet.
Die Idee dieses Projekts besteht darin, alle Komponenten zu entwickeln und in eine einheitliche Plattform für die Verwaltung einzugeben. Designer können auf der Plattform Komponenten auswählen und in Echtzeit eine Vorschau der Komponenten anzeigen und anpassen Sie erhalten während des gesamten Prozesses und die Plattform nimmt Anpassungen vor. Als Ergebnis wird eine Codezeichenfolge generiert. Solange der Code an das Frontend übergeben wird, können Sie diese Codezeichenfolge verwenden, um die geänderte Komponente zu reproduzieren Durch den Designer auf der Plattform können Sie den HTML/CSS/JS-Code der Komponente auch mit einem Klick kopieren und schnell auf das Projekt Go anwenden, wodurch die Front-End-Entwicklungskosten des Komponententeils nahezu Null sind. Die Plattform muss die folgenden Funktionen implementieren:
* Verwaltungskomponente, unterstützt Klassifizierung, Suche und Sortierung
* Komponenten anzeigen und Online-Vorschau/Bearbeitung von Komponenten unterstützen
* Komponentenübergabe, unterstützt das Generieren von Komponentencode und das Reproduzieren von Komponenten basierend auf Code
* Nutzungsstatistiken, unterstützen Statistiken zur Nutzung von Komponenten, um die weitere Optimierung von Komponenten zu erleichtern
Vue+Vue-Router+Vuex
Front-End-Komponentenverwaltungsplattform
Github
Das obige ist der detaillierte Inhalt vonBasierend auf Vue Family Bucket entwickelte Front-End-Komponentenverwaltungsplattform. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!