如何调试 Yeoman 应用程序？

Question

我来自使用像Java、Python/Django和PHP等服务器端语言/平台开发Web应用的背景，现在开始学习Node.js和yeoman。我认为能够调试服务器端代码对于提高代码质量至关重要。Node支持通过node-inspector和--debug选项进行调试。但是，如果使用生成器创建了一个基于yeoman的应用程序，例如AngularJS，并使用grunt启动，是否有一种简单的方法启用调试？

也许我首先应该问一个更高级的问题：如果yeoman推广（如教程中所示）AngularJS，这是一个客户端MVC框架，那么大部分代码将从浏览器而不是Node运行。这是为什么yeoman不再重视服务器端调试，因此没有记录文档呢？

- abbr

---

请参考使用node-inspector与Grunt任务的示例，了解如何使用node-inspector。 - dc5

Answer 1

简单来说：

npm install -g node-inspector
node-debug yo GENERATOR_NAME

这将会打开一个带有初始断点的Chrome DevTool。

- Thiago C. S Ventura

Answer 2

我正在开发一个yemoan angular-fullstack应用程序。 我按照以下步骤调试服务器端node js应用程序代码：

1. 安装node-inspector。
2. 修改应用程序的'Gruntfile.js'，将express服务器的debug设置为'true'

express: { dev: { options: { script: 'server/app.js', debug: true } } }

3. 运行grunt serve启动应用程序。
4. 在另一个终端中运行node-inspector。
5. 打开Chrome并导航到http://127.0.0.1:8080/debug?port=5858。（如果您看到grunt控制台，则会看到节点调试器位于端口5858上）。
6. 现在，您应该能够在服务器应用程序代码中设置断点并进行调试。 您可以在代码中放置debugger语句，以强制节点在该点中断并等待您的检查。

注意： node-inspector --no-preload可以更快地加载节点检查器。

- Jerome Anthony

---

使用 grunt serve:debug 可能会有所帮助。 - Rob Lao

Answer 3

1. 安装node-inspector:

   $ npm install -g node-inspector

2. 启动Node Inspector服务器:

   $ node-inspector

3. 以调试模式运行带有Yeoman-cli的node.js:

   $ node --debug path\to\global\npm\node_modules\yo\cli.js MyGenerator

   其中'MyGenerator'是要调试的Yeoman生成器名称。
   在Windows中，“path\to\global\npm”类似于“C:\Users{UserName}\AppData\Roaming\npm”。

4. 打开Chrome或Opera并转到http://localhost:8080/debug?port=5858

- Shrike

---

我的问题不是关于调试yeoman生成器，而是关于使用grant启动的由yeoman生成的webapp的调试。 - abbr

@Fred 如果是这样，那么你的问题根本不涉及Yeoman。要理解你想要调试什么：浏览器中的客户端代码还是服务器端代码。并使用适当的工具。 - Shrike

Answer 4

如果您使用AngularJS和Chrome，可以使用Batarang插件。在Yeoman项目中，可以使用Grunt来检查您的应用程序。

• http://net.tutsplus.com/tutorials/javascript-ajax/meeting-grunt-the-build-tool-for-javascript/
• https://github.com/gruntjs/grunt/wiki/Getting-started

- EpokK

Answer 5

首先在Gruntfile.js中启用调试模式

grunt.initConfig({
...
express : {
options : {
    port : process.env.PORT || 9000
},
dev : {
    options : {
        script : 'server.js',
        debug : true //enable
    }
},
...

使用以下命令保存并运行项目：grunt serve:debug，现在您可以在项目的任何部分使用debugger;变量。

- Hernan Humaña

Answer 6

也许这个答案并不适用于所有的Yeoman生成的应用程序，但我在使用angular-fullstack生成器时找到了解决方法，该生成器将express作为后端服务器。通过在Gruntfile.js文件中设置express配置的debug为true来启用调试：

grunt.initConfig({
     ...
 express : {
    options : {
        port : process.env.PORT || 9000
    },
    dev : {
        options : {
            script : 'server.js',
            debug : true //enable debugging
        }
    },
    ...

然后，默认情况下可以启动node-inspector在5858端口上进行调试。

- abbr