WebStorm 2025.3 Help

Nx

WebStorm 集成了 Nx 构建系统,该系统针对 monorepo 进行了优化,内置了代码脚手架、模块边界强制、自动更新以及具有缓存和分发功能的高级 CI 功能。

WebStorm 为您提供了一个专用的 Nx 控制台 工具窗口和一个 Nx 运行/调试配置,用于运行和调试您的脚本。

如果您使用 Karma 进行测试,您还可以在 Karma 运行/调试配置中将 Nx 包指定为 Karma 包。

开始之前

  1. 请确保您的计算机上安装了 Node.js

  2. 按照 从 JetBrains Marketplace 安装插件 中的描述,在 设置 | 插件 页面、 Marketplace 选项卡上安装并启用 Nx Console 插件。

创建 NX 工作区

  1. 点击 新建项目 屏幕上的 欢迎 或从主菜单中选择 文件 | 新建 | 项目。 将打开 新建 项目 对话框

  2. 在左侧窗格中,选择 Nx

  3. 在右侧窗格中:

    • 指定将存储项目相关文件的文件夹路径。

    • Node.js 运行时 字段中,指定要使用的 Node.js 运行时。 从列表中选择一个已配置的运行时,或选择 添加 以配置新的运行时。

    • 命令 列表中选择 npx create-nx-workspace @latest

    创建 Nx 工作区
  4. 点击 创建 并回答向导中的问题。 根据这些答案,创建并设置了一个工作区。

    向导中的问题已回答。 Nx 工作区生成中
  5. 点击链接进入授权页面。

    授权链接

Nx 控制台工具窗口

Nx 控制台 工具窗口为您提供有关工作区的信息。 它列出了您的所有项目以及可以为其运行的目标,例如 buildservetestlint ,以及您设置的任何配置。

在目标的上下文菜单中,您可以运行或调试目标,以及编辑其专用的运行/调试配置。

Nx Console 工具窗口
  1. 要打开 Nx 控制台 工具窗口,请点击侧边栏上的

    Nx Console 工具窗口栏
    ,或转到主菜单中的 视图 | 工具窗口 | Nx 控制台

  2. 要查看显示的项目和目标列表,请点击 刷新工作区 或点击工具窗口工具栏上的 重新加载 Nx 项目图标

    刷新工作区

运行和调试 Nx 目标

您可以从 Nx 控制台 工具窗口或通过专用的 Nx 运行/调试配置运行和调试 Nx 目标。

运行目标

  • Nx 控制台 工具窗口中,选择一个目标,然后从其上下文菜单中选择 运行“<target_name>”

    Nx 工具窗口:运行目标
  • 从工具栏上的 运行 小部件中,选择目标名称的配置,然后点击其旁边的 运行图标

    通过运行/调试配置运行目标

调试目标

  1. 在脚本中需要的地方设置断点。

  2. Nx 控制台 工具窗口中,选择一个目标,然后从其上下文菜单中选择 调试 '<target_name>'

    Nx 工具窗口:调试目标

    或者,从工具栏上的 运行 小部件中,选择目标名称的配置,然后点击其旁边的 调试图标

    通过运行/调试配置调试目标

编辑目标的运行/调试配置

  1. 请执行以下操作之一:

    • Nx 控制台 工具窗口中,选择一个目标,然后从其上下文菜单中选择 编辑 '<target_name>'

      Nx 控制台工具窗口:编辑运行/调试配置
    • 从主工具栏上的 运行 小部件中,选择 编辑配置 ,然后从列表中选择适当的配置。

      编辑运行/调试配置 - 运行小部件

    编辑运行/调试配置:<target name> 对话框将打开。

  2. 更新默认自动生成的设置并保存运行/调试配置。

最后修改日期: 2025年 12月 8日