WebStorm 2021.2 Help

WebStorm projects

Whatever you do in WebStorm, you do that in the context of a project. 无论您在WebStorm中做什么,都是在项目环境中进行的。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).WebStorm中的“项目”是一个文件夹,其中包含您编辑的源代码、您使用的库和工具(例如,在node_modules子文件夹中)以及各种应用程序配置文件(例如,package.json.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.在WebStorm中打开文件夹后,.idea子文件夹将添加到其中,WebStorm将在其中存储其内部配置设置,例如项目代码样式或版本控制系统的配置设置。

All the settings files in the .idea directory should be put under version control except workspace.xml, which stores your local preferences. .idea目录中的所有设置文件都应置于版本控制之下,除了存储本地首选项的workspace.xmlThe workspace.xml file should be marked as ignored by VCS.workspace.xml文件应标记为被VCS忽略

WebStorm does not support direct editing of files on remote hosts. WebStorm不支持直接编辑远程主机上的文件。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. 因此,要在WebStorm中使用远程源,您需要下载它们,打开存储它们的文件夹,并在WebStorm项目中排列它们,如从现有本地源创建项目中所述。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)切换到下一个项目窗口:Ctrl+Alt+](“窗口”|“下一个项目窗口”)

  • Switch to the previous project window: Ctrl+Alt+[(Window | Previous Project Window)切换到上一个项目窗口:Ctrl+Alt+[(“窗口”|“上一个项目窗口”)

  • 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.右键单击项目的根文件夹,然后从关联菜单中选择“重构”|“重命名”或按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