WebStorm 2021.2 Help

WebStorm projects

Whatever you do in WebStorm, you do that in the context of a project. A project in WebStorm is a folder with the source code you edit, the libraries and tools you use (for example, in the node_modules subfolder), and various app configuration files (for example, package.json or .eslintrc).

Once you have opened a folder in WebStorm, the .idea subfolder is added to it where WebStorm stores its internal configuration settings, for example, for the project code style or the version control system.

All the settings files in the .idea directory should be put under version control except workspace.xml, which stores your local preferences. The workspace.xml file should be marked as ignored by VCS.

WebStorm does not support direct editing of files on remote hosts. Therefore to work with remote sources in WebStorm, you need to download them, open the folder where they are stored, and arrange them in a WebStorm project, as described in Creating a project from existing local sources. To keep your local and remote sources synchronized, configure automatic upload using the Upload changed files automatically to the default server list in the Deployment Options dialog.

Switch between projects

If you have several opened projects at the same time, you can switch between them using the following options:

  • Switch to the next project window: Ctrl+Alt+](Window | Next Project Window)

  • Switch to the previous project window: Ctrl+Alt+[(Window | Previous Project Window)

  • Alternatively, open the Window menu and select the project to which you want to switch.

Rename projects

  1. Right-click the root folder of your project and select Refactor | Rename from the context menu or press Shift+F6.

  2. In the dialog that opens, choose the rename strategy.

    • If the project name is the same as the name of its root folder, select Rename directory.

    • If the project name is different from the name of its root folder, select Rename project.

      Alternatively, select File | Rename Project from the main menu and type the new name of the project in the dialog that opens.

      Also select this option if your application is deployed to a remote server and the project root folder is mapped to the server root.

    Of course, you can rename the root folder and update the mapping in the server configuration accordingly, see Configure synchronization with a Web server for details.

Move a project to another location

  1. In the Project tool window Alt+1, right-click the root directory of your project and select Refactor | Move directory(F6).

  2. In the dialog that opens, specify a new location for the project and click Refactor.

    Moving a project to another location

Change the default location for projects

In WebStorm, you can specify the default parent folder for your projects. WebStorm will start with this folder when you open projects. This default location will be also suggested every time you create a new project.

  1. Open the Settings/Preferences dialog Ctrl+Alt+S and go to Appearance & Behavior | System Settings.

  2. In the Default directory field, specify the path to the folder in which you want to store your projects.

    Changing the default location for projects

    Next time you create a project, WebStorm will suggest the specified directory as the parent for the new project.

    Creating a new project: the default location suggested

Share project settings through VCS

Configuration files are processed according to your choice. Once you modify the project settings, and a new configuration file is created, the IDE shows a notification at the bottom of the screen prompting you to select how you want to treat configuration files in this project:

  • View files: view the list of created configuration files and select, which of them you want to place under version control. After that, the selected files will be scheduled for addition to VCS.

  • Always Add: silently schedule all configuration files created in the .idea directory for addition to VCS (applies only to the current project).

  • Don't Ask Again: never schedule configuration files for addition to VCS; they will have the unversioned status until you manually add them to VCS (applies only to the current project).

If you close the notification without selecting any option, it will appear again after a new configuration file is created. The new file will also go to the list that will be there until you select one of the options even if you restart the IDE.

Notification prompting to select how to treat
                    configuration files

List of non-shareable configuration files

WebStorm identifies configuration files and adds them to the list of ignored files automatically. However, if you are sharing your project manually, we recommend that you avoid placing these files and folders under version control:

  • .idea/workspace.xml
  • .idea/usage.statistics.xml
  • .idea/dictionaries folder

  • .idea/shelf folder

For the full list of files, refer to How to manage projects under Version Control Systems and JetBrains.gitignore.

Copy global settings to the project level

Global (IDE) settings are stored separately from projects. That is why, these settings are not shared through version control together with the project.

Some settings, however, can be copied to the project level. For example, you can create a copy of your code style configuration, inspection profiles, the list of classes and packages excluded from code completion and auto-import. If you do so, the IDE creates the corresponding configuration files in the .idea directory that you can share together with the project through VCS.

Last modified: 10 June 2021