Vue-cliの使用-Vueの実行可能な環境をすばやく構築します

Vue-cliのインストール

前書き

Vue-CliはVueの足場です。インストールが完了したら、コマンドを使用して実行可能なVue開発環境をすばやく生成できます。これにより、面倒なWebpack構成やさまざまなプラグインのインストールを省略できるため、実行可能環境、簡単なプロジェクトの初期構築を容易にし、Vueを学びます。

:ここで使用されているスキャフォールディングバージョンは比較的新しく、必要なNode.jsバージョンも比較的高いです。元のNode.jsバージョンをアンインストールしたくない場合は、以下に解決策を説明します。

インストール手順

  1. Node.jsがインストールされていない場合は、最初にNode.jsをインストールする必要があり
    ます(https://nodejs.org/zh-cn/現在のリリースバージョンを選択します)。Node.jsがすでにインストールされている場合は、node-incmdを実行します。 v現在インストールされているバージョンを表示します。Node.js
    V8.9以降をインストールする必要があります。アンインストールして再インストールせずに、2つのNodeバージョンを直接インストールするだけです。解決策は次のとおりです。
1.安装node.js管理工具nvm for windows
包地址为:https://github.com/coreybutler/nvm-windows/releases,选择nvm-setup.zip下载即可。
2.安装教程:https://www.cnblogs.com/gaozejie/p/10689742.html ,注意选择的安装路径最好不要有中文和空格。
3.安装完nvm后,可以通过以下几个命令来完成对node的版本切换:
nvm list //查看本地安装的所有版本
nvm install //安装相关版本的node.js
nvm use 11.12.0 //切换当前node版本到11.13.0
nvm uninstall 11.12.0 //卸载版本号为11.12.0的Node.js
  1. Node.jsをインストールした後、通常はNode.jsに付属のnpmを介して関連する依存関係パッケージを管理しますが、パッケージのダウンロードとTaobaoミラーのインストールを容易にするために、npmウェアハウスアドレスは海外にあります。cmdでコマンドを実行します。
npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm -v //判断是否安装成功
  1. コマンドを実行してVue-cliをインストールします
npm install -g @vue/cli
vue --version //检验安装是否成功

インストールが成功した場合のテスト結果は次のとおりです。
ここに画像の説明を挿入します

ラピッドプロトタイピング

単一の* .vueファイルの迅速な開発に適しています。ただし、グローバル依存関係をインストールする必要があります。
cnpm install -g @ vue / cli-service-global

インストールが完了したら、デフォルトの単語main.js、index.js、App.vueまたはapp.vue1つの.vueファイルをすばやく作成できますAAA.vueなどのエントリファイルを明示的に指定してから起動し、次のようにブラウザに表示することもできます。

vue serve AAA.vue

簡単なプロジェクトを作成する

対応する依存関係構成(Babel + ESLint)の生成など、次のコマンドを実行することで、簡単なプロジェクトをすばやく作成できます。これらのデフォルト設定は、新しいプロジェクトのプロトタイプをすばやく作成するのに非常に適しています。

vue create hello-world

同時に、プロジェクトを作成するためのuiインターフェイスの使用もサポートします。

vue ui

Vue-cliの公式アドレス

おすすめ

転載: blog.csdn.net/dypnlw/article/details/112847615