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!