ビュー 2

npm のインストール速度が遅いため、Taobao のイメージとそのコマンドcnpm を使用できます。cnpm をインストールします。

npm install -g cnpm --registry=https://registry.npmmirror.com

このようにして、npmコマンドの代わりにcnpmコマンドを使用してモジュールをインストールできます。

# 安装 Vue 2 (最新稳定版)
cnpm install vue

Vue は公式のコマンドラインツールvue-cliを提供しており、これを使用して大規模な単一ページアプリケーションをすばやく構築できます。

# 全局安装 vue-cli
cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
vue init webpack my-project
...开始配置项目

プロジェクトをビルドしたら、次をインストールして実行します。

cd my-project
cnpm install
cnpm run dev

上記のコマンドを正常に実行した後、 http://localhost:8080 にアクセスします。

Vueプロジェクトは、次のコマンドを使用してパッケージ化されます。

cnpm run build

実行が完了すると、Vueプロジェクトの下にdist ディレクトリが生成され、通常はindex.htmlファイルとstaticディレクトリが含まれます. staticディレクトリには、静的ファイルjs、css、およびイメージディレクトリimagesが含まれます.

ビュー 3

npm のインストール速度が遅いため、Taobao のイメージとそのコマンドcnpm を使用できます。cnpmをインストールします (既にインストールされている場合は無視します)。

npm install -g cnpm --registry=https://registry.npmmirror.com

CLI を表示

Vue.js は、大規模な単一ページアプリケーションをすばやく構築するために使用できる公式のコマンドラインツールを提供します。Vue 3の場合、 npm で @vue/cli として利用可能なVue CLI v4.5を使用する必要があります。

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

# 全局安装 vue-cli
cnpm install -g @vue/cli

プロジェクトは、次の 3 つの方法でビルドできます。

1、入ります

webpackテンプレートに基づいて新しいプロジェクトを作成します。

vue init webpack project-name

2、ビュー作成

プロジェクトを作成するvue createコマンドの構文形式は次のとおりです。

vue create [options] project-name

3、vue ui

vue createコマンドを使用してプロジェクトを作成するだけでなく、ビジュアル作成ツールを使用してプロジェクトを作成することもできます。

vue ui

速い

Viteは、ネイティブのESモジュールインポートメソッドにより、超高速のコールドサーバー起動を可能にするWeb開発ビルドツールです。ターミナルで次のコマンドを実行すると、Vite を使用してVueプロジェクトをすばやくビルドできます。構文は次のとおりです。

npm init vite project-name

上記の Vue-CLI または Viteツールを使用してプロジェクトをビルドした後、依存関係をインストールして実行します。

cd project-name
cnpm install
cnpm run dev

Vueプロジェクトをパッケージ化するには、次のコマンドを使用します。

cnpm run build

バージョン番号を表示

Vueプロジェクトで Vue の バージョン番号を表示します。

npm list vue

vue-cli の バージョン番号を表示:

vue -V
or
vue --version

Vueプロジェクトで Vue と vue-cli のバージョン番号を表示します( package.json ファイルはプロジェクトのルートディレクトリにあります)。

vue-cliをアップグレードする

# 卸载旧版本 vue-cli (vue-cli 2)
npm uninstall -g vue-cli
# 安装新版本 vue-cli (vue-cli 3)
npm install -g @vue/cli

Vue のインストールとプロジェクトのビルド