So installieren Sie vuejs3

So installieren Sie vuejs3: 1. Laden Sie die neue Version direkt von der offiziellen Website von Vue.js herunter und führen Sie sie mit dem <script>-Tag ein. 2. Verwenden Sie die CDN-Methode, um vuejs zu installieren vuejs installieren. </script>

Die Betriebsumgebung dieses Artikels: Windows7-System, VueJS3-Version, DELL G3-Computer.

Wie installiere ich vuejs3?

Vue3-Installation

1. Unabhängige Version

Wir können die neueste Version direkt von der offiziellen Website von Vue.js herunterladen und mit dem Tag <script> vorstellen. </script>

Vue.js herunterladen: https://unpkg.com/vue@3.2.7/dist/vue.global.js

2. CDN-Methode verwenden

Im Folgenden werden zwei relativ stabile ausländische CDNs empfohlen , ich habe in China kein besseres gefunden, und es wird trotzdem empfohlen, es lokal herunterzuladen.

Staticfile CDN (inländisch): https://cdn.staticfile.org/vue/3.0.5/vue.global.js

unpkg: https://unpkg.com/vue@next, wird weiterhin mit npm veröffentlichen Die neueste Version ist konsistent.

cdnjs: https://cdnjs.cloudflare.com/ajax/libs/vue/3.0.5/vue.global.js

Staticfile CDN (inländisch)

<div id="app">
  <p>{{ message }}</p>
</div>

unpkg (empfohlen)

<div id="app">
  <p>{{ message }}</p>
</div>

cdnjs

<div id="app">
  <p>{{ message }}</p>
</div>

3. NPM-Methode

Aufgrund der langsamen Installationsgeschwindigkeit von npm verwendet dieses Tutorial das Taobao-Image und seinen Befehl cnpm. Anweisungen zur Installation und Verwendung finden Sie unter: Verwenden des Taobao-NPM-Images.

Die npm-Version muss größer als 3.0 sein. Wenn sie niedriger als diese Version ist, müssen Sie sie aktualisieren:

# 查看版本
$ npm -v
2.3.0
#升级 npm
cnpm install npm -g
# 升级或安装 cnpm
npm install cnpm -g

Es wird empfohlen, die cnpm-Installation zu verwenden, wenn große Anwendungen mit Vue.js erstellt werden können mit Webpack- oder Browserify-Modul-Packager:

# 最新稳定版
$ cnpm install vue@next

Befehlszeilentool

Vue.js bietet ein offizielles Befehlszeilentool, mit dem schnell große Einzelseitenanwendungen erstellt werden können.

# 全局安装 vue-cli
$ cnpm install -g @vue/cli
# 安装完后查看版本
$ vue --version
@vue/cli 4.5.11

Hinweis: vue-cli 3.x und vue-cli 2.x verwenden denselben Vue-Befehl. Wenn Sie vue-cli 2.x zuvor installiert haben, wird dieser durch Vue-cli 3.x ersetzt.

Installieren Sie @vue/cli-int:

$ cnpm i -g @vue/cli-init

Erstellen Sie das Projekt

$ vue init webpack runoob-vue3-test
# 这里需要进行一些配置，默认回车即可
? Project name runoob-vue3-test
? Project description A Vue.js project
? Author runoob <test@runoob.com>
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Set up unit tests Yes
? Pick a test runner jest
? Setup e2e tests with Nightwatch? Yes
? Should we run `npm install` for you after the project has been created? (recommended) npm
   vue-cli · Generated "runoob-vue3-test".
# Installing project dependencies ...
# ========================
...

Geben Sie das Projekt ein, installieren Sie es und führen Sie es aus:

$ cd runoob-vue3-test
$ cnpm run dev
  DONE  Compiled successfully in 2558ms          
 I  Your application is running here: http://localhost:8080

Nach erfolgreicher Ausführung des obigen Befehls besuchen Sie http://localhost:8080/, das Ausgabeergebnis lautet wie folgt:

Hinweis: Vue.js unterstützt IE8 und niedrigere IE-Versionen nicht.

Verwandte Empfehlungen: „vue.js-Tutorial“ „Die neuesten 5 vue.js-Video-Tutorial-Auswahlen“

Das obige ist der detaillierte Inhalt vonSo installieren Sie vuejs3. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!