WebStorm 2025.2 Help

运行/调试配置:Gulp.js

创建: 运行(U)| 编辑配置(E) 添加新配置|Gulp.js

本页介绍了特定于配置的条目以及所有运行/调试配置通用的 选项。 有关使用此配置的更多信息,请参阅 Gulp

在此对话框中,为运行 Gulp.js 任务创建配置。

开始之前

  1. 下载并安装 Node.js

  2. 按照 安装 Gulp.js中的说明安装 gulp 包。

Gulp.js 专用配置设置

项目

描述

Gulpfile

在此字段中,指定 Gulpfile.js 文件的位置,以获取任务定义。 从下拉列表中选择路径,或单击 浏览按钮 按钮,然后从打开的对话框中选择文件。

任务

在此字段中,指定要运行的任务。 请执行以下操作之一:

  • 要运行一个任务,请从下拉列表中选择。

  • 要运行多个任务,请在字段中输入任务名称,任务名称之间使用空格分隔。

参数

在此字段中,指定任务执行时所使用的参数。 采用格式 --<parameter_name> <parameter_value> ,例如: --env development。 详情请参阅 Gulp 官方网站

Node 解释器

在此字段中,指定要使用的 Node.js 解释器。

如果选择了 项目 别名,WebStorm 将自动使用 Node 解释器 字段中 Node.js 页面的项目默认解释器。 在大多数情况下,WebStorm 会检测项目默认解释器并自动填写该字段。

您也可以选择其他已配置的本地或远程解释器,或单击 浏览按钮 进行新解释器配置。

详细信息请参阅 配置远程 Node.js 解释器配置本地 Node.js 解释器 ,以及 在 Windows 子系统中使用 Node.js

Node 选项

在此字段中,输入要传递给 Node.js 可执行文件的 Node.js 专用命令行选项。 详见 Node 参数

默认配置中,在此字段中输入 --harmony ,WebStorm 将根据用 ECMA6 编写的 Gulpfile.js 构建任务树。

在技术上,WebStorm 会调用 Gulp.js,并依据 默认 Gulp.js 运行配置处理 Gulpfile.js 。 此操作静默进行,无需您执行任何步骤。 但是,如果您的 Gulpfile.js 是用 ECMA6 编写的,默认情况下 WebStorm 无法识别该格式,构建任务树会失败。 要解决此问题,请将 --harmony 指定为 Node 参数 ,用于 默认 Gulp.js 运行配置

Gulp 包

在此字段中,指定安装在项目根目录下 本地gulp包的路径。 如需了解详情,请参阅 Installing Gulp.js

环境变量

在此字段中,指定 Node.js 可执行文件的 环境变量 (如适用)。 单击字段右侧的 浏览 浏览按钮 ,在打开的 环境变量 对话框中配置变量列表:

  • 要定义新变量,请点击 添加按钮 并指定变量名称和值。

  • 要放弃某个变量的定义,请在列表中选择该变量并单击 移除按钮

  • 准备就绪后点击 确定

变量定义显示在 环境变量 只读字段中,各个变量使用分号分隔,例如:

  • NODE_PATH :以 : 分隔的目录列表,将前缀添加到模块搜索路径。

  • NODE_MODULE_CONTEXTS :设置为 1 以在模块各自的全局上下文中加载模块。

  • NODE_DISABLE_COLORS :设置为 1 可在 REPL 中禁用颜色。

通用设置

在编辑运行配置(而非运行配置模板)时,您可以指定以下选项:

项目

说明

名称(N)

指定运行配置的名称,以便在编辑或运行时快速识别。

允许多个实例(U)

允许并行运行多个该运行配置的实例。

默认情况下,该选项处于禁用状态,当您在另一个实例仍在运行时启动该配置时,WebStorm 会建议停止当前运行实例并启动另一个实例。 当运行配置占用大量资源,且无合理理由运行多个实例时,此设置非常有用。

存储为项目文件(S)

将包含运行配置设置的文件保存,以便与其他团队成员共享。 默认位置为 .idea/runConfigurations 。 但是,如果您不希望共享 .idea 目录,可以将配置保存到项目内的其他任何目录中。

默认情况下,该选项处于禁用状态,WebStorm 会将运行配置设置存储在 .idea/workspace.xml 中。

工具栏

运行/调试配置的树状视图包含一个工具栏,可帮助您管理项目中的配置并调整默认配置模板。

项目

快捷键

说明

添加按钮

Alt+Insert

创建运行/调试配置。

移除按钮

Alt+Delete

删除所选运行/调试配置。 请注意,无法删除默认配置。

复制

Ctrl+D

创建所选运行/调试配置的副本。 请注意,可以创建默认配置的副本。

保存配置

仅在选择 临时配置 时,此按钮才会显示。 点击此按钮可将临时配置保存为永久配置。

移动到新文件夹/创建新文件夹

移动到新文件夹/创建新文件夹。 您可以通过 将运行/调试配置放入文件夹 来进行分组。

要创建文件夹,请在一个类别内选择配置,点击 文件夹 ,然后指定文件夹名称。 如果仅选中一个类别,则会创建一个空文件夹。

然后,如需将配置移入文件夹、在文件夹之间移动或移出文件夹,可使用拖放方式或 上移下移 按钮。

要取消分组,请选择一个文件夹并点击 移除配置

排序配置

点击此按钮按字母顺序对配置进行排序。

启动前

在此区域,您可以指定在启动所选运行/调试配置之前需要执行的任务。 任务按照在列表中的出现顺序执行。

项目

快捷键

说明

添加按钮

Alt+Insert

点击此图标以添加下列可用任务之一:

  • 启动Web 浏览器 :选择此选项以启动浏览器。 在打开的对话框中,选择浏览器类型并提供启动 URL。 另外,请指定是否需要使用 JavaScript 调试器启动浏览器。

  • 运行外部工具 :选择以运行外部应用程序。 在打开的对话框中,选择您要运行的一个或多个应用程序。 如果它尚未在 WebStorm 中定义,请添加其定义。 有关更多信息,请参阅 外部工具外部工具

  • 运行另一个配置 :选择以执行其他运行/调试配置,并在开始当前配置前等待其完成。 如果您希望并行运行多个配置,请使用 复合运行/调试配置

  • 运行File Watcher :选择此选项让 WebStorm 应用当前活动的所有 File Watcher

  • 运行远程外部工具 :添加一个 远程 SSH 外部工具

  • 运行Grunt 任务 :选择此选项以运行 Grunt 任务。

    在打开的 Grunt 任务 对话框中,指定定义所需任务的 Gruntfile.js ,选择要执行的任务,并指定要传递给 Grunt 工具的参数。

    指定 Node.js 解释器的位置、传递给它的参数以及 grunt-cli 包的路径。

  • 运行 Gulp 任务 :选择此选项以运行 Gulp 任务。

    在打开的 Gulp 任务 对话框中,指定定义所需任务的 Gulpfile.js ,选择要执行的任务,并指定要传递给 Gulp 工具的参数。

    指定 Node.js 解释器的位置、要传递给它的参数,以及 gulp 包的路径。

  • 运行 npm 脚本 :选择此选项以执行 npm 脚本。

    在打开的 NPM 脚本 对话框中,指定 npm run/debug configuration settings

  • 编译TypeScript :选择此选项以运行内置的 TypeScript 编译器,从而确保您对 TypeScript 代码所做的所有更改都体现在生成的 JavaScript 文件中。 在打开的 TypeScript 编译设置 对话框中,选择或取消选择 检查错误 复选框,以便在检测到错误时配置编译器的行为:

    • 如果选中 检查错误 复选框,则编译器会显示所有错误,并且运行配置将不会启动。

    • 如果取消选中 检查错误 复选框,则编译器会显示所有检测到的错误,但仍将启动运行配置。

  • 生成CoffeeScript 源映射 :选择此选项以为 CoffeeScript 源代码生成 source map。 在打开的对话框中,指定 CoffeeScript 源文件的位置。

移除按钮

Alt+Delete

单击此图标可从列表中移除所选任务。

编辑

Enter

单击此图标可编辑所选任务。 在打开的对话框中进行必要的更改。

方法上移

方法下移

Alt+Up

Alt+Down

单击这些图标可将所选任务在列表中上移或下移一行。 任务按其在列表中出现的顺序执行。

显示此页面

选择此复选框以在实际启动运行/调试配置之前显示运行/调试配置设置。

激活工具窗口

默认情况下选中此复选框,启动运行/调试配置时会打开 RunDebug 工具窗口。

否则,如果取消选中该复选框,则工具窗口将被隐藏。 但是,配置运行期间,您可以通过按 Alt+4Alt+5 手动打开相应的工具窗口。

最后修改日期: 2025年 9月 26日