Gulp
PyCharm 与 Gulp.js 任务运行器 集成。 PyCharm 解析 Gulpfile.js 文件，识别任务定义，以树形视图显示任务，允许您在树中的任务与其在 Gulpfile.js 文件中的定义之间导航，并支持运行和调试任务。
Gulp.js 任务可以从专用的 Gulp 工具窗口 中的任务树运行，或在 Gulpfile.js 文件中通过启动 Gulp.js 运行配置 来运行，或者作为其他运行配置的启动前任务运行。 PyCharm 显示了在 运行工具窗口中执行任务的结果。 工具窗口显示 Grunt 输出，报告发生的错误，列出未找到的包或插件等。 上次执行的任务名称会显示在工具窗口的标题栏中。
在开始之前
请确保您的计算机上已安装 Node.js。
安装 Gulp.js
要在 一个 PyCharm 项目中使用 Gulp，您需要两个包：
全局安装的 gulp-cli 包（ Gulp 命令行界面），用于执行 Gulp 命令。
作为开发依赖安装的 gulp 包，用于构建项目任务树，并在编辑 Gulpfile.js 文件时提供编码辅助。 有关 Gulpfile.js 的更多信息，请参阅 Gulp.js 官方网站。
全局安装 gulp-cli
在内置的 终端 （Alt+F12 ）中，键入：
npm install -global gulp-cli
在项目中安装 Gulp.js
在内置的 终端 （Alt+F12 ）中，键入：
npm install gulp --save-dev
从任务树运行 Gulp.js 任务
PyCharm 使您能够直接在 Gulp 工具窗口的任务树中轻松、快速地运行 Gulp.js 任务。 PyCharm 会自动创建一个临时运行配置，必要时，您可以将其保存并在以后使用。
当您在 项目 工具窗口(Alt+1 )中的 Gulpfile.js 或在编辑器中打开的 Gulpfile.js 的上下文菜单中选择 显示 Gulp 任务 来调用Gulp.js时，Gulp.js 会立即开始构建 任务树。 该树是根据调用 Gulp.js 的 Gulpfile.js 文件构建的。 如果您的项目中有多个 Gulpfile.js 文件，您可以为每个文件构建单独的任务树，并且无需放弃先前构建的任务树即可运行任务。 每棵树会显示在单独的节点下。
从技术上讲， PyCharm 会调用 Gulp.js，并处理 Gulpfile.js ，依据 默认 Gulp.js 运行配置。 该操作会静默完成，无需您执行任何步骤。
打开 Gulp 工具窗口
在当前 PyCharm 会话中首次构建任务树时， Gulp 工具窗口尚未打开。
在 项目 工具窗口 Alt+1 中选择所需的 Gulpfile.js 文件，或在编辑器中将其打开并在上下文菜单中选择 显示 Gulp 任务。
默认情况下， PyCharm 无法识别 Gulpfile.js 中的 ES6，并且无法构建任务树。 要解决此问题，请更新 默认 Gulp.js 运行配置。
从 ES6 Gulpfile.js 构建任务树
转到 。 或者，在工具栏的 运行 小部件中选择 编辑配置。
在 模板 节点下，点击 Gulp.js。
在打开的 运行/调试配置： Gulp.js 对话框中，请在 Node 参数 字段中输入
--harmony，然后点击 确定。
从 Gulp 工具窗口构建任务树
在 Gulp 工具窗口中，点击工具栏上的
，然后从列表中选择所需的 Gulpfile.js 文件。 默认情况下， PyCharm 会显示项目根目录中的 Gulpfile.js 文件。如果您有其他 Gulpfile.js 文件，请点击 选择 Gulpfile.js ，并在打开的对话框中选择所需的 Gulpfile.js 文件。 PyCharm 会添加一个新节点，其标题包含所选 Gulpfile.js 文件的路径，并在该新节点下构建任务树。
重新构建脚本树
切换到所需节点，然后点击工具栏上的
。
按名称对树中的任务排序
点击工具栏上的
，从菜单中选择 排序依据 ，然后选择 名称。 默认情况下，树显示任务的顺序与它们在 Gulpfile.js 中定义的顺序相同（选项 定义顺序）。
运行任务
双击任务。
在树中选择任务，然后按 Enter ，或从上下文菜单中选择 运行 <task name>。
运行默认任务
在树中选择根节点，然后从上下文菜单中选择 运行默认。
运行多个任务
使用多选模式：按住 Shift （用于相邻项目）或 Ctrl （用于不相邻项目）键并选择所需的任务，然后从所选内容的上下文菜单中选择 运行 或 调试。
导航到任务定义
在树中选择所需的任务，然后从所选内容的上下文菜单中选择 跳转到源代码。
从 Gulpfile.js 运行任务
将插入符号置于要运行的任务的定义处，然后从上下文菜单中选择 运行 <task name>。 PyCharm 会创建并启动一个临时运行配置，其名称为所选任务的名称。
要保存自动创建的临时运行配置，请将插入符号置于创建该配置的任务的定义处，然后从所选内容的上下文菜单中选择 保存<task name>。
根据运行配置运行和调试任务
除了使用 PyCharm 自动创建的临时运行配置之外，您还可以创建并启动您自己的 Gulp.js 运行配置。
创建 Gulp.js 运行配置
转到 。 或者，在工具栏的 运行 小部件中选择 编辑配置。
在打开的 编辑配置 对话框中，点击工具栏上的 添加 按钮（
），然后从列表中选择 Gulp.js。 将打开 运行/调试配置： Gulp.js 对话框。指定运行配置的名称、要运行的任务（使用空格作为分隔符）、定义这些任务的 Gulpfile.js 文件的位置，以及当前项目根目录下安装的 gulp 包的路径。
指定要使用的 Node.js 运行时。
如果您选择 项目 别名， PyCharm 将自动使用 JavaScript 运行时 页面中 Node 运行时 字段的项目默认解释器。 在大多数情况下， PyCharm 会检测项目默认运行时并自行填写该字段。
您还可以选择另一个已配置的本地或远程解释器，或点击
并配置一个新的解释器。可选地为 Node.js 指定 环境变量 以及用于执行任务的参数。 使用格式
--<parameter_name> <parameter_value>，例如：--env development。 了解更多信息，请参阅 Gulp 官方网站。
运行任务
在工具栏的 运行/调试配置 小部件列表中，选择新创建的 配置，然后点击其旁边的
。 输出会显示在 运行工具窗口 中。
调试任务
，或从主菜单中选择 将 Gulp 任务作为启动前任务运行
通过从主菜单中选择 打开 运行/调试配置对话框 ，然后从列表中选择所需的配置，或点击
并选择相应的运行配置类型以新建配置。在打开的对话框中，在 启动前 区域中点击
，然后从列表中选择 运行 Gulp 任务。在 Gulp 任务 对话框中，指定 Gulpfile.js ，其中定义了所需的任务，选择要执行的任务，并指定要传递给 Gulp 工具的参数。
指定 Node.js 运行时的位置、要传递给它的参数以及指向 gulp 包的路径。
自动运行 Gulp.js 任务
如果您有一些经常运行的任务，您可以将相应的运行配置添加到 启动任务 列表中。 这些任务会在项目启动时自动执行。