How to debug a Gulp task?(如何调试 Gulp 任务?)
问题描述
如何使用诸如 Google Chrome 调试器之类的调试器来调试在我的 gulpfile.js
中定义的 gulp 任务,逐行执行任务的代码?
How do I debug a gulp task defined in my gulpfile.js
with a debugger such as the Google Chrome debugger, stepping through the task's code line by line?
推荐答案
使用 Node.js 6.3+ 版本,您可以使用 --inspect
flag 在运行你的任务时.
With Node.js version 6.3+ you can use the --inspect
flag when running your task.
调试名为 css
的 gulp 任务:
To debug a gulp task named css
:
找出你的 gulp 可执行文件在哪里.如果 gulp 安装在本地,它将位于
node_modules/.bin/gulp
.如果 gulp 已全局安装,请在终端中运行which gulp
(Linux/Mac) 或where gulp
(Windows) 以找到它.
Find out where your gulp executable lives. If gulp is installed locally, this will be at
node_modules/.bin/gulp
. If gulp is installed globally, runwhich gulp
(Linux/Mac) orwhere gulp
(Windows) in a terminal to find it.
根据您的 Node.js 版本运行这些命令之一.如果需要,请将 ./node_modules/.bin/gulp
替换为步骤 1 中 gulp 安装的路径.
Run one of these commands according to your version of Node.js. If required, replace ./node_modules/.bin/gulp
with the path to your gulp installation from step 1.
- Node.js 6.3+:
node --inspect --debug-brk ./node_modules/.bin/gulp css
- Node.js 7+:
node --inspect-brk ./node_modules/.bin/gulp css
使用 Chrome 浏览到 chrome://inspect
.
Use Chrome to browse to chrome://inspect
.
--debug-brk
(Node.js 6.3+) 和 --inspect-brk
(Node.js 7+) 标志用于暂停代码执行在任务的第一行代码上.这让您有机会在任务完成之前打开 Chrome 调试器并设置断点.
The --debug-brk
(Node.js 6.3+) and --inspect-brk
(Node.js 7+) flags are used to pause code execution on the first line of code of your task. This gives you a chance to open up the Chrome debugger and set breakpoints before the task finishes.
如果您不希望调试器在第一行代码处暂停,只需使用 --inspect
标志.
If you don't want the debugger to pause on first line of code, just use the --inspect
flag.
您还可以安装 Node.js Inspector Manager (NIM) Chrome 扩展以帮助完成第 3 步.这将自动打开一个 Chrome 选项卡,调试器已准备就绪,作为手动浏览 URL 的替代方法.
You can also install the Node.js Inspector Manager (NIM) extension for Chrome to help with step 3. This will automatically open up a Chrome tab with the debugger ready to go, as an alternative to manually browsing to a URL.
这篇关于如何调试 Gulp 任务?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:如何调试 Gulp 任务?


基础教程推荐
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 直接将值设置为滑块 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01