如何在 JetBrains WebStorm 中调试 Grunt 服务的站点答案

【问题标题】：How to debugging a Grunt served site in JetBrains WebStorm如何在 JetBrains WebStorm 中调试 Grunt 服务的站点
【发布时间】：2014-04-10 16:05:05
【问题描述】：

我使用了 Yeoman 生成器，并且正在使用 Grunt 通过连接模块提供文件：

// The actual grunt server settings
    connect: {
      options: {
        port: 9000,
        // Change this to '0.0.0.0' to access the server from outside.
        hostname: 'localhost',
        livereload: 35730
      },
      livereload: {
        options: {
          open: true,
          base: [
            '.tmp',
            '<%= yeoman.app %>'
          ]
        }
      },

在浏览器中进行测试并使用 Chrome 开发工具进行调试时一切正常。

但是我更喜欢通过其浏览器插件在 WebStorm 内部进行调试是否可以将连接进程连接到 WebStorm 以通过这种方式进行调试？

【问题讨论】：

标签： gruntjs yeoman webstorm grunt-contrib-connect

【解决方案1】：

请看http://devnet.jetbrains.com/message/5505407#5505407 简而言之，要完成这项工作，您通常需要为用于启动 Grunt 的 Node.js 运行配置启用“浏览器/实时编辑”（选中“启动后”和“使用 javascript 调试器”，'http://localhost:9000' 指定 URL）并更改'open' livereload 选项在 gruntfile 中从 'true' 到 'false' 以避免在 127.0.0.1:9000 上打开第二个选项卡

【讨论】：