Heim > Artikel > Web-Frontend > Detaillierte Erläuterung der Schritte zur Verwendung von vue-cli 3.0.x
Dieses Mal werde ich Ihnen die Schritte zur Verwendung von vue-cli 3.0.x ausführlich erläutern. Was sind die Vorsichtsmaßnahmen bei der Verwendung von vue-cli 3.0.x ein Blick.
1. Offizielle Website-Informationen
Überprüfen Sie beim Erlernen von Technologie immer die offiziellen Website-Informationen. Weil die Informationen dort am schnellsten aktualisiert werden.
vue-cli
vue-cli-Dokumentation
2. InstallationUmgebung
Hier ist der spezielle Header, er wird empfohlen Wenn Sie npm install -g @vue/cli verwenden und über Yarn Global @vue/cli hinzufügen, müssen andere Einstellungen vorgenommen werden und einige Dateien werden für einige Minuten löschen generiert.
npm install -g @vue/cli # or yarn global add @vue/cli # 使用vue命令,创建项目(不同于cli2.0的init,create) vue create my-project
Wenn Sie Yarn Global Add @vue/cli zur Installation verwenden, müssen Sie das Verzeichnis eingeben. Führen Sie
yarn // 安装项目依赖 cd packages/@vue/cli // 目录 yarn link //添加 link `vue` 执行指命 。 vue create my-project // 创建项目 。
3 aus. Multi-Umgebungskonfiguration
Da das Unternehmen über eine Entwicklungsumgebung, eine Testumgebung, eine gemeinsame Debugging-Umgebung und eine Online-Umgebung verfügt. Reduzieren Sie die manuelle Konfiguration und konfigurieren Sie sie einmal. Daher wurde in 2.0.x der Konfigurationstyp „package.json „tt“: „node build/tt-build.js““ hinzugefügt und viele Dateien konnten nicht konfiguriert werden. In vue-cli 3.0.x wird die Dateikonfiguration „.env“ unterstützt. Ich habe hier die Konfigurationen „.env.development“, „.env.produktion“ und „.env.test“ hinzugefügt.
1. Grundlegende Korrespondenz und Standard
development is used by vue-cli-service serve production is used by vue-cli-service build test is used by vue-cli-service test
2. Beginnen Sie mit der Angabe der Konfiguration
Um weitere Konfigurationen hinzuzufügen, müssen Sie die Konfiguration unten angeben.
"dev-build": "vue-cli-service build --mode development",
3.".env "KonfigurationsdateiSchreiben
Das Inhaltsformat der Konfigurationsdatei ist wie folgt:
VUE_APP_*
Zum Beispiel: „ .env.produktion“-Inhalt Wie folgt
VUE_APP_MOCK_URL = 'https://xxx.xxx.xxx/restapi/'
4. Passen Sie die Umgebungskonfiguration an
console.log(process.env.VUE_APP_MOCK_URL); process.env.NODE_ENV // 特定 BASE_URL // vue.config.js 配置
Ich glaube, Sie haben die Methode gemeistert, nachdem Sie den Fall in diesem Artikel gelesen haben. Für weitere spannende Informationen zahlen Sie bitte Beachten Sie auch andere verwandte Artikel auf der chinesischen PHP-Website!
Empfohlene Lektüre:
So entwickeln Sie eine benutzerdefinierte Bibliothek
So verwenden Sie JS, um mehrere Arrays zur Neuberechnung zusammenzuführen
Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Schritte zur Verwendung von vue-cli 3.0.x. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!