Durch Vue-Mit CLI das Problem der Multi-Umgebungs-Konfiguration und des Veröffentlichens von Webpack lösen

Vue之所以现在如此之火，一部分也得益于有官方的脚手架生成工具Vue-CLI，大大简化了初学者环境搭建的成本，但是在实际业务中我们往往需要实现其他功能来对webpack进行改造，本文将根据一些实际的业务需求，先学习Vue-CLI生成的模板，然后进行相关修改。

Vue-CLI生成模板文件目录

├── README.md
├── build
│ ├── build.js
│ ├── check-versions.js
│ ├── dev-client.js
│ ├── dev-server.js
│ ├── utils.js
│ ├── webpack.base.conf.js
│ ├── webpack.dev.conf.js
│ └── webpack.prod.conf.js
├── config
│ ├── dev.env.js
│ ├── index.js
│ └── prod.env.js
├── index.html
├── package.json
├── src
│ ├── App.vue
│ ├── assets
│ │ └── logo.png
│ ├── components
│ │ └── Hello.vue
│ └── main.js
└── static

Der Hauptpunkt dieses Artikels ist

build - Code der Kompilierungsaufgaben

config - webpack-Konfigurationsdatei

package.json - Grundlegende Informationen des Projekts

Die Bedeutung jeder Zeile der webpack-Konfiguration werde ich hier nicht im Detail erläutern, bitte beziehen Sie sich auf Vue2.0 Scaffold-Webpack-Konfigurationsdatei analysiert

Gängige Anforderungen: Konfiguration und Veröffentlichung in mehreren Umgebungen

Vue-Das von CLI generierte Template ist nur mit npm run dev, npm run build konfiguriert, um die Entwicklungsumgebung zu starten und das Packen auszuführen. Oft hat der normale Entwicklungsprozess eines Unternehmens mindestens Entwicklung, Test, Simulation und Produktionsumgebung, und die Serveranfragenadressen oder einige Konfigurationsparameter sind unterschiedlich, und bei der Veröffentlichung müssen die Dateien auf mehreren Servern bereitgestellt werden, daher ist es erforderlich, automatisierte Skripte auszuführen, um den Aufbau und die Veröffentlichung durchzuführen.

Wir müssen zuerst dieses Problem klären, ein Zitat aus einem Artikel, Autor: Zheng Haibo, Link, Quelle: Zhihu

Dies hat nichts mit Vue zu tun, es ist ein allgemeines Problem: Wo wird der Code gebaut. Wenn der Fragegeber den Server meint, auf dem der Server läuft, sind beide nicht die besten Optionen. Viele Anfänger, einschließlich mir vor meiner Arbeit, dachten, die Deployment von Code würde so ablaufen

Aber in großen Internetunternehmen kann es komplizierter sein. Die folgenden Anleitungen sind gängige Praktiken und haben einige Prozesse vereinfacht, um Neulingen das Verständnis zu erleichtern. Code wird auf den Git- oder SVN-Server eingereicht. Hierbei handelt es sich um Quelldateien, nicht um die nach dem Build generierten Dateien

2. Der Aufbau des Servers zieht die zu veröffentlichende Versionsnummer von der Git-Server, hier wird die Installation der Abhängigkeiten abgeschlossen, wie z.B. Vue des Fragegebers. Und die Dateien für die Bereitstellung werden erstellt, diese Dateien werden in der Regel auch in ein Komprimierungsarchiv gepackt, um die Verwaltung zu erleichtern

3Die nach dem Bau bereitgestellten Release-Pakete werden auf den Übergabepunkt hochgeladen: die Dateiverwaltungsserver-Cluster

4Die实际上, die betriebenen Server sind in der Regel nicht Einzeln, sondern Cluster. Diese n Server ziehen die entsprechenden Versionsarchive von dem Dateiserver ab und entpacken sie letztlich zum Betrieb.

　

Tatsächlich gibt es hier eine klare Reihenfolge der Prozesse, und es wäre sehr lästig, wenn alles manuell durchgeführt würde. Daher haben große Unternehmen in der Regel eine automatische Deployment-Plattform, um diese Arbeiten global zu koordinieren. Tatsächlich müssen Entwickler nur auf 'Einen Klick zum Deployment' klicken, um die obigen Inhalte zu erledigen.

Wenn wir zusammen mit Plattformen wie gitlab, github die angebotenen webhook-Automatic notifications und -deployment-Plattformen verwenden, wurde der Code der stabilen Version bereits gesendet (Push Event). Dann müssen wir nicht einmal auf den Button klicken. Dies ist ein typischer Fall von Build-Deployment-Decoupling, der viele Vorteile bringt, wie z.B. sicherzustellen, dass nur eine Version des Codes gebaut wird, um die Möglichkeit von Inkompatibilität durch Multi-Environment-Build zu vermeiden. Der Build ist ein hoher Aufwand, kann die Stabilität des Servers beeinträchtigen und kann schnell rückgängig gemacht oder wiederhergestellt werden. Es ist nicht erforderlich, dass gleiche Versionen des Codes neu aufgebaut werden...

Nach all diesen Erklärungen ist das Packen und Bauen nicht eine einfache Angelegenheit, daher ist es notwendig, automatische Werkzeuge zur Konfiguration zu verwenden. Bereits vorhandene ausgereifte Lösungen sind, mit Docker eine Anwendungskontainerengine zu erstellen, um zu bauen, zu veröffentlichen und so weiter. Aber dieses Feld kenne ich nicht gut, daher können Schüler, die sich damit auskennen, ihre Erfahrungen teilen.

Zusammenfassung

Hierbei stellt der Redakteur den Lesern die Fragen zur Webpack-Multienvironmentskonfiguration und -veröffentlichung vor. Hoffentlich hilft dies den Lesern. Wenn Sie Fragen haben, hinterlassen Sie bitte eine Nachricht, der Redakteur wird rechtzeitig antworten. Ich danke auch sehr für die Unterstützung von呐喊教程!

Erklärung: Der Inhalt dieses Artikels wurde aus dem Internet übernommen und gehört dem Urheberrechtsinhaber. Der Inhalt wurde von Internetnutzern freiwillig beigesteuert und hochgeladen. Diese Website besitzt keine Eigentumsrechte und hat den Inhalt nicht manuell bearbeitet. Sie übernimmt auch keine rechtlichen Verantwortlichkeiten. Wenn Sie verdächtige urheberrechtliche Inhalte finden, sind Sie herzlich eingeladen, eine E-Mail an notice#w zu senden.3Anmeldung: Bitte ersetzen Sie bei der Anmeldung # durch @ und melden Sie Missbrauch, fügen Sie relevante Beweise hinzu. Bei nachgewiesener Urheberrechtsverletzung wird die Website den fraglichen Inhalt sofort löschen.