WSL

WSL を設定する

1. Microsoft ストアから WSL ディストリビューション（Ubuntu など）をダウンロードしてインストールします。

   この手順では、最新の「Fall Creators Update」(最小バージョン 1709、ビルド 16299.15) を適用した少なくとも Windows 10 以降を使用してください。手順については、公式ガイド Linux 用の Windows サブシステムをインストールするを参照してください。

   WSL 2 を使用するには、Windows のバージョンが 10 ビルド 18917 以降である必要があります。これらの手順(英語)に従って、ディストリビューションを切り替えます。

2. Linux ディストリビューションを実行します。

   最初の起動時に、システムは Windows のオプション機能を有効にするように求めるメッセージを表示する場合があります。この場合、次のことを行う必要があります。

   • 管理者として Windows PowerShell を開き、実行します

     Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linux

   • コンピューターを再起動してください。

Node.js と npm をインストールする

Linux(Ubuntu) インストール内で、nvm、Node、js、npm がインストールされていることを確認してください。インストール手順の詳細については、Linux の Windows サブシステムに Node.js をインストールするを参照してください。

1. コマンドラインシェルまたは組み込みのターミナル (Alt+F12) を開きます。

2. cURL をインストールします。

   sudo apt-get install curl

3. nvm をインストールします。

   curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/master/install.sh | bash

4. 次のいずれかのコマンドを実行して Node.js をインストールします。

   • nvm install --lts 安定した Long Term Service Node.js バージョンをインストールする

   • インストールする nvm install node または現在のリリースバージョン

WSL ファイルシステムで新しいプロジェクトを作成する

1. 通常どおり、Windows 上でローカルにインストールして実行 WebStorm を実行します。

2. ウェルカム画面で、新規プロジェクトをクリックします。

   

3. 開いているダイアログで:

   1. 左側のペインのリストからプロジェクトタイプを選択します。

   2. 右側のペインで、プロジェクト名と場所を指定します。WSL のプロジェクトの場所には、WSL ファイルシステムへの \\wsl$ で始まる絶対パスが表示されます。

      

   3. ほとんどの場合、WebStorm は Node.js の場所を指定するように要求します。Node.js がまだない場合は、リストからダウンロードを選択します。または、追加を選択して WSL Node.js インタープリターを構成します。

      

      次に、ポップアップから WSL を追加するを選択します。

      

      開いた WSL ノードランタイムを追加するダイアログで、現在使用されている Linux ディストリビューションと Node.js へのパスを指定します。

      

   4. 右側のペインの他のフィールドに入力します。フィールドのセットは、選択したプロジェクトタイプによって異なります。詳細については、言語およびフレームワークの対応する記事を参照してください。

4. 作成をクリックします。

   

   WebStorm は WSL にプロジェクトを作成し、IDE を移動せずに WSL 環境内でプロジェクトを開発およびビルドできます。

WSL ファイルシステムに保存されているプロジェクトを開く

WebStorm では、WSL ファイルシステムに保存されているプロジェクトを直接開いて、他のプロジェクトと同じように操作できます。

1. ウェルカム画面のオープンをクリックするか、メインメニューからファイル | オープンを選択してください。

2. 開いたパスの選択ダイアログで、開くプロジェクトが含まれている WSL ファイルシステム内のフォルダーを選択するか、プロジェクトの場所へのパスを手動で入力します。

   パス構文は \\wsl.localhost\DistributionName です。ここで、DistributionName は Ubuntu、Debian、Arch などの Linux ディストリビューションの名前です。

   

WSL ベースの Node.js ランタイムを構成する

Node.js インストールを現在のプロジェクトのデフォルトのランタイムとして設定することも、この Node.js バージョンを Node.js 実行 / デバッグ構成で構成して使用することもできます。

1. 設定ダイアログ（Ctrl+Alt+S）で、言語 & フレームワーク | JavaScript ランタイム> に移動します。

2. Node.js ランタイムダイアログでノードランタイムフィールドの横にある をクリックし、 をクリックして、リストから WSL を追加するを選択します。

   

3. 開いている WSL ノードランタイムを追加するダイアログで、使用している Linux ディストリビューションを選択し、Node.js へのパスを指定します。

   

   構成された Node.js インストールがリストに追加され、現在のプロジェクトのデフォルトとして設定されます。

   

プロジェクトを実行してデバッグする

アプリケーションを実行またはデバッグすると、WSL で実行されます。実行構成を開くと、WebStorm が WSL をローカルマシンとして参照していることに注意してください。

1. アプリケーションのタイプに応じて、適切なタイプの実行 / デバッグ構成を作成するを選択します。そのためには、実行 | 実行構成の編集に移動します。次に、実行 / デバッグ構成ダイアログで、ツールバーの をクリックし、必要な実行 / デバッグ構成タイプを選択します。開いたダイアログで、必要に応じてフィールドに入力するか、定義済みの値を受け入れます。

   

2. アプリケーションを実行するには、実行ウィジェットから新しく作成された実行 / デバッグ構成を選択し、その横にある をクリックします。

3. アプリケーションをデバッグするには、必要な場所にブレークポイントを設定し、実行ウィジェットから新しく作成された実行 / デバッグ構成を選択し、その横にある をクリックします。