次の方法で共有

Linux 用 Windows サブシステムに Vue.js をインストールする

Vue.js Web フレームワークを Windows Subsystem for Linux (WSL) にインストールして、Windows 上に Vue.js 開発環境をセットアップするのに役立つガイドです。 詳細については、 Vue.js の概要 ページを参照してください。

Vue は、Windows または WSL に直接 インストールできます。 通常、NodeJS バックエンドと対話する場合、Linux 運用サーバーと同等にする場合、または Bash コマンドを使用するチュートリアルに従うことを計画している場合は、WSL にインストールすることをお勧めします。 また、Vue.jsの代わりに Vite を検討することもできます。

[前提条件]

  • Linux ディストリビューション (Ubuntu など) を含む Linux 用 Windows サブシステム (WSL) をインストールし、WSL 2 モードで実行されていることを確認します。 これは PowerShell を開き、「wsl -l -v」と入力することによって確認できます。
  • WSL 2に Node.js をインストールする: これには、バージョン マネージャー、パッケージ マネージャー、Visual Studio Code、リモート開発拡張機能が含まれます。 ノード パッケージ マネージャー (npm) を使用して、Vue.jsをインストールします。

重要

WSL を使用して Linux ディストリビューションをインストールすると、ファイルを格納するためのディレクトリが作成されます\\wsl\Ubuntu-20.04 (Ubuntu-20.04 が、使用している Linux ディストリビューションに置き換えられます)。 Windows エクスプローラーでこのディレクトリを開くには、WSL コマンド ラインを開き、 cd ~を使用してホーム ディレクトリを選択し、コマンドを入力 explorer.exe . マウントされた C ドライブ (/mnt/c/Users/yourname$) で操作するファイルをインストールまたは保存しないように注意してください。 これにより、インストールとビルドの時間が大幅に遅くなります。

Vue.js のインストール

WSL に Vue.js をインストールするには:

  1. WSL コマンド ラインを開きます (例:Ubuntu)。

  2. 新しいプロジェクト フォルダーを作成し (mkdir VueProjects)、そのディレクトリに移動します (cd VueProjects)。

  3. ノード パッケージ マネージャー (npm) を使用して Vue.js をインストールします。

npm install vue

vue --versionコマンドを使用して、インストールしたバージョン番号を確認します。

注

NPM ではなく CDN を使用して Vue.js をインストールするには、 Vue.js インストールに関するドキュメントを参照してください。

Vue CLI のインストール

Vue CLI は、ターミナル/コマンド ラインで Vue を操作するためのツールキットです。 これにより、グラフィカル ユーザー インターフェイス (vue ui) を使用して、新しいプロジェクト (vue の作成)、プロトタイプの新しいアイデア (vue serve)、またはプロジェクトの管理をすばやくスキャフォールディングできます。 Vue CLI は、ビルドの複雑さの一部 (Babel や Webpack の使用など) を自動的に処理するグローバルにインストールされた npm パッケージです。 新しいシングルページ アプリをビルドしていない場合は、Vue CLI が不要な場合や必要ない場合があります。

Vue CLI をインストールするには、npm を使用します。 アップグレード (-g) するには、vue upgrade --next フラグを使用してグローバルにインストールする必要があります。

npm install -g @vue/cli

追加できる追加のプラグイン (GraphQL を統合するための linting や Apollo など) の詳細については、Vue CLI ドキュメントの Vue CLI プラグイン を参照してください。

その他のリソース