WebStorm 2026.1 ヘルプ

Yeoman

Yeoman(英語) を使用して、フレームワーク固有の WebStorm プロジェクトを作成できます。詳細については、フレームワーク固有のプロジェクトの生成を参照してください。

始める前に

  1. お使いのコンピューターに Node.js(英語) がインストールされていることを確認してください。

  2. JetBrains マーケットプレイスからプラグインをインストールする説明に従って、設定 | プラグインページのマーケットプレースタブに Yeoman プラグインをインストールして有効にします。

WebStorm に Yeoman をインストールして設定するには

  1. 埋め込まれたターミナルAlt+F12)で、次のように入力します。

    npm install -g yo

  2. 設定ダイアログ (Ctrl+Alt+S) で、言語 & フレームワーク | JavaScript | Yeoman に移動します。開いた Yeoman ページで、グローバルにインストールされた yo パッケージの場所と使用するローカル Node.js ランタイムを指定します。

プロジェクトスタブジェネレーターのリストを構成するには

  1. ウェルカム画面で新規プロジェクトをクリックするか、メインメニューからファイル | 新規 | プロジェクトを選択します。新規プロジェクトダイアログが開きます。

  2. 左側のペインで、Yeoman を選択します。

  3. 右側のペインには、以前にインストールされた Yeoman ジェネレーター(英語)がすべて表示されます。ジェネレーターのインストールをクリックします。

  4. 利用可能なすべてのジェネレーターパッケージを表示するダイアログボックスから、左側のペインで必要なパッケージを選択し、右側のペインに表示されるジェネレーターのインストールボタンをクリックします。ダイアログを離れずに複数のパッケージを次々にインストールすることができます。

    インストールが終了したら、閉じるをクリックして、新しく追加されたパッケージですでに展開されているジェネレーターのリストに戻ります。

ジェネレーターでプロジェクトを作成するには

  1. ウェルカム画面で新規プロジェクトをクリックするか、メインメニューからファイル | 新規 | プロジェクトを選択します。新規プロジェクトダイアログが開きます。

  2. 左側のペインで、Yeoman を選択します。

  3. 右側のペインには、以前にインストールされたすべての Yeoman ジェネレーター(英語)が表示されます。リストを展開するには、ジェネレーターのインストールをクリックします。上記の WebStorm に Yeoman をインストールして設定するにはを参照してください。

    リストから必要なジェネレーターを選択し、次へをクリックします。

  4. 開始する新規プロジェクトウィザードで必要な設定を指定します。ページ数とその内容は、選択したジェネレーターに依存します。

  5. ウィザードの最後のページで、npm install& bower install を実行するチェックボックスを選択または選択解除して、Node パッケージマネージャーおよび Bower を実行して、新規プロジェクトの開発に必要なパッケージをインストールするかどうかを指定します。

  6. 次へをクリックして、現在のウィンドウまたは新しいウィンドウで新しいプロジェクトを開きます。

2025 年 10 月 28 日

関連ページ:

プロジェクトを作成

WebStorm では、空のプロジェクトを作成したり、プロジェクトとしてフォルダーを開いたり、VCS からソースをチェックアウトしたり、プロジェクトを作成することができます。また、フレームワークテンプレートを使用してプロジェクトを生成することもできます。そのため、新しいアプリケーションは、必要なすべてのパッケージと構成ですでにブートストラップされています。WebStorm はまたあらゆるプロジェクトの設定、ファイルおよびホールダーを保存し、新しいプロジェクトを作成するときテンプレートとして使用す...

プラグインのインストール

プラグインは WebStorm のコア機能を拡張します。例: プラグインをインストールして、次の機能を取得します。バージョン管理システム、課題追跡システム、ビルド管理サーバー、その他のツールとの統合。さまざまな言語とフレームワークのコーディング支援サポート。ショートカットのヒント、ライブプレビュー、ファイルウォッチャーなど。新しいプログラミング言語を学ぶのに役立つコーディング演習。デフォルトでは、WebStorm には多数のプラグインがバンドルされています。バンドルされたプラグインを無効にするこ...

Node.js

Node.js は、サーバーやコマンドラインなど、ブラウザーの外部で JavaScript を実行するための軽量ランタイム環境です。WebStorm は Node.js と統合されており、アプリケーションの構成、編集、実行、デバッグ、テスト、プロファイリング、保守を支援します。Node.js がアプリケーションのローカルランタイムとして、または npm パッケージの管理、JavaScript リンターの実行、ツールのビルド、フレームワークのテストなどにのみ必要な場合は、Node.js をインストール...

新規プロジェクトの作成ダイアログ

このダイアログを使用して、空のプロジェクトを作成したり、アプリケーション開発用のフレームワーク固有のプロジェクトスタブを生成したりします。ダイアログの左側のペインには、スタブを生成できるプロジェクトタイプのリストが表示されます。利用可能なプロジェクトタイプのセットは、インストールされてアクティブ化されているプラグインによって異なります。右側のペインの内容は、選択したプロジェクトの種類によって異なります。ロケーションフィールドはすべてのプロジェクトタイプに共通です。空のプロジェクト内容のないプロジ...

YAML

WebStorm を使用すると、YAML ファイル(.yml、.yaml)を操作でき、次の機能がサポートされます。構文のハイライトカラー設定は、設定ダイアログ () のエディター | カラースキームの切り替え | YAML ページで変更できます。コードのフォーマット YAML に関連するコードスタイル設定には、設定ダイアログ () のエディター | コードスタイル | YAML ページでアクセスできます。InspectionsWebStorm は、重複したキー、YAML ドキュメント内の未使用のアンカ...

WebStorm プロジェクト

WebStorm で何をするにしても、プロジェクトのコンテキストでそれを行います。WebStorm のプロジェクトは、編集するソースコード、使用するライブラリとツール(たとえば node_modules サブフォルダー)、およびさまざまなアプリ構成ファイル(たとえば package.json または .eslintrc)を含むフォルダーです。WebStorm でフォルダーを開くと、.idea サブフォルダーが追加されます。WebStorm には、プロジェクトコードスタイルやバージョン管理システムなどの内部設...