WebStorm 2026.1 Help

プロジェクトの作成

WebStorm では空のプロジェクトを作成したり、フォルダーをプロジェクトとして開いたり、VCS からソースをチェックアウトしてプロジェクトを作成したりできます。 また、フレームワークのテンプレートからプロジェクトを生成することで、新しいアプリケーションが必要なパッケージや構成を備えて初期化された状態で始められます。

WebStorm は、あらゆるプロジェクトの設定、ファイル、フォルダーを保存し、新しいプロジェクト作成時のテンプレートとして利用できます。

空のプロジェクトを作成する

  1. Welcome 画面新規プロジェクト をクリックするか、メインメニューから ファイル | 新規 | プロジェクト を選択してください。

  2. 表示されるダイアログで、左側のペインで 空のプロジェクト を選択してからプロジェクトの場所を指定します。

    新しい空のプロジェクトを作成する

    設定 ダイアログの システム設定ページデフォルトディレクトリ を指定した場合、WebStorm はこのデフォルトの場所を提案します。 プロジェクトのデフォルトの保存場所を変更するを参照してください。

基本的な JavaScript または TypeScript プロジェクトを作成する

WebStorm は基本的な JavaScript または TypeScript プロジェクトを作成できるため、最小限の構成でプロジェクトをセットアップできます。

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

  2. 左側のペインで、 新規プロジェクト を選択します。

  3. 右側のペインで、 JavaScript または TypeScript を選択し、プロジェクト関連ファイルが保存されるフォルダーへのパスを指定します。

    生成されたプロジェクトには、 package.json と、 console.log() ウェルカムメッセージを含む index.js または index.ts ファイルが含まれます。 TypeScript を選択した場合、WebStorm はコンパイラーオプションを設定するための tsconfig.json ファイルも生成します。

    デフォルトでは、WebStorm は Git リポジトリも作成します。

  4. サンプル Web アプリケーションを生成するには、 オンボーディングのヒント付き playground プロジェクトを生成する チェックボックスを選択します。 WebStorm は Vite テンプレートでプロジェクトを作成し、スムーズなオンボーディングをサポートするヒントを提供します。

    基本的な JavaScript プロジェクトを作成する

既存のローカルソースからプロジェクトを作成する

作業するソースがすでにマシン上にある場合は、保存先のフォルダーを開いて WebStorm プロジェクトにするだけです:

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

  2. 開いたダイアログで、目的のソースコードを含むディレクトリを選択します。

  3. OK をクリックし、新しいプロジェクトを別のウィンドウで開くか、現在のプロジェクトを閉じて既存のプロジェクトを再利用するかを指定します。 詳細については、「複数のプロジェクトを開く 」を参照してください。

または、ソースを含むフォルダーを ウェルカム画面 にドラッグするだけです。

Creating a new WebStorm project by dragging a folder to the Welcome Screen

バージョン管理からプロジェクトをチェックアウトする

  1. ようこそ 画面で リポジトリのクローン をクリックします。

    あるいは、メインメニューから ファイル|新規|バージョン管理からプロジェクト…Git|クローン…VCS | バージョン管理から取得​ を選択します。

    メインメニューの Git の代わりに、プロジェクトに関連付けられている他のバージョン管理システムが表示される場合があります。 例: Mercurial または Perforce

  2. 表示されるダイアログで、リストからバージョン管理システムを選択し、アプリケーションソースをチェックアウトするリポジトリを指定します。 詳細については、 プロジェクトをチェックアウトする(クローン) を参照してください。

フレームワーク固有のプロジェクトを生成する

WebStorm は新しいフレームワーク固有のアプリケーションを作成し、その構造を設定し、必要に応じて必須パッケージをダウンロードできます。 Yeoman(英語) ジェネレーターも使用できます。 詳細については、 Yeoman を参照してください。

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

  2. 左側のペインで、アプリケーションの種類に応じて使用するテンプレートを選択します。

  3. 右側のペインのコントロールのセットは、選択したテンプレートによって異なります。 詳細については、 その他の言語およびフレームワーク にあるフレームワーク固有のページの 新しいアプリケーションを作成する を参照してください。

プロジェクトテンプレート

新しいプロジェクトで再現したいファイルとフォルダー、設定、構成を含むプロジェクトがあるとします。 このプロジェクトをカスタムプロジェクトテンプレートとして保存してから、このテンプレートを製品の作成に使用できます。

プロジェクトをテンプレートとして保存する

  1. ツール | プロジェクトをテンプレートとして保存 に進みます。

  2. 開いたダイアログで、テンプレートの名前を指定し、必要に応じて簡単なテンプレートの説明を入力します。

    WebStorm はすべてのプロジェクト設定をテンプレートの .idea フォルダーから保存します。 そのため、新しいプロジェクトに定義済みの実行 / デバッグ構成をいくつか設定したい場合は、これらの構成で 共有 チェックボックスを選択してからテンプレートを保存してください。

テンプレートからプロジェクトを作成する

  1. Welcome 画面新規プロジェクト をクリックするか、メインメニューから ファイル | 新規 | プロジェクト を選択してください。

  2. 表示されたダイアログで、左側のペインから必要なテンプレートを選択します。 プロジェクトテンプレートは the project template icon でマークされています。

    カスタムテンプレートからプロジェクトを作成する
  3. 右側のペインで、プロジェクトの場所を指定します。

プロジェクトテンプレートを削除する

  1. ツール | プロジェクトテンプレートの管理 に進みます。

  2. 削除するテンプレートを選択して、 the Remove button をクリックします。

2026 年 6 月 8 日