WebStorm 2021.2 Help

Creating projects

In WebStorm, you can create empty projects, open folders as projects, check out sources from your VCS and create a project from them. You can also generate a project by a framework templates so your new application is already bootstrapped with all the required packages and configurations.

WebStorm can also save the settings, files, and folders of any project and use them as a template when creating new projects.

Creating an empty project

  1. Click Create New Project on the Welcome screen or select File | New | Project from the main menu.

  2. In the dialog that opens, select Empty Project in the left-hand pane and then specify the project location.

    Creating a new empty project

    If you specified the Default directory on the System settings page of the Settings/Preferences dialog, WebStorm will suggest this default location. See Changing the default location for projects.

Creating a project from existing local sources

When the sources to work with are already on your machine, you can just open the folder where they are stored and make it a WebStorm project:

  1. Click Open on the Welcome screen or select File | Open from the main menu.

  2. In the dialog that opens, select the directory that contains the desired source code.

  3. Click OK and specify whether you want the new project to be opened in a separate window or close the current project and reuse the existing one. See Opening multiple projects for details.

Alternatively, just drag the folder with your sources to the Welcome Screen.

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

Checking out a project from Version Control

  1. Click Get from VCS on the Welcome screen. Alternatively, select File | Project from Version Control or <Your_VCS> | Get from Version Control from the main menu.

    <Your_VCS> stands for the Version Control System with which your currently opened project is associated.

  2. In the dialog that opens, select your version control system from the list and specify the repository to check out the application sources from. See Check out a project (clone) for details.

Generating framework-specific projects

WebStorm can create new framework-specific applications for you, set up their structure, and download the required packages, if necessary. You can also use the Yeoman generator, see Yeoman for details.

  1. Click Create New Project on the Welcome screen or select File | New | Project from the main menu. The Create New Project Dialog opens.

  2. In the left-hand pane, choose the template to use depending on the type of your application.

  3. The set of controls in the right-hand pane depends on the chosen template. For details, see Creating a new application on framework-specific pages under Languages and frameworks.

Project templates

Suppose you have a project with files and folders, settings, and configuration that you want to reproduce in new projects. You can save this project as a custom project template and then use this template for product creation.

Save a project as a template

  1. From the main menu, select Tools | Save Project as Template.

  2. In the dialog that opens, specify the name of the template and optionally provide a brief template description.

    Note that WebStorm saves all project settings from the .idea folder in the template. So if you want your new projects to have some predefined run/debug configurations, select the Share checkbox in these configurations before you save the template.

Create a project from a template

  1. Click Create New Project on the Welcome screen or select File | New | Project from the main menu.

  2. In the dialog that opens, select the required template from the left-hand pane. Project templates are marked with the project template icon.

    Creating a project from a custom template
  3. In the right-hand pane, specify the project location.

Delete project templates

  1. From the main menu, select Tools | Manage Project Templates.

  2. Select the template that you want to remove and click the Remove button.

Last modified: 19 October 2021