Grunt.js 不处于监视模式答案

【问题标题】：Grunt.js not staying in watch modeGrunt.js 不处于监视模式
【发布时间】：2014-11-06 15:38:57
【问题描述】：

我确定我遗漏了一些东西。我正在尝试将在一个项目上工作的 gruntfile 重新用于一个新项目。该文件运行并启动一个服务器实例，但不在我设置的端口上，并且它没有“进入监视模式”。

grunt 命令导致 Opening server for /Users/stevelombardi/Documents/command-central/cc on port 1337.

确实，如果我打开浏览器到http://127.0.0.1:1337，我会看到主页。但是，我希望端口 9000（请参阅 gruntfile）并让它监视我的文件的更改。

这里是 gruntfile。我在这里搞砸了什么？

'use strict';

module.exports = function(grunt) {

require('load-grunt-tasks')(grunt);

grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),


    watch: {
      options: {
        livereload: true,
      },
      html: {
        files: [
          '{,*/}*.html'
        ]
      },
      sass: {
        files: ['sass/{,*/}*.scss'],
        tasks: ['sass:app'],
        options: {
          livereload: false
        }
      },
      js: {
        files: ['scripts/{,*/}*.js']
      },
      css: {
        files: ['css/*.css'],
      },
      gruntfile: {
        files: ['Gruntfile.js']
      }
    },

    sass: {
      app: {
        options: {
          style: 'compact',
          sourcemap: 'auto'
        },
        files: {
          'css/styles.css': 'sass/styles.scss',

        }
      }
    },

    connect: {
      options: {
        port: 9000,
        // Change this to '0.0.0.0' to access the server from outside.
        hostname: '127.0.0.1',
        livereload: 35729
      },
      livereload: {
        options: {
          open: true,
          base: ''
        }
      },
      livepreview: {
        options: {
          open: true,
          base: ''
        }
      }
    }


});


  grunt.registerTask('default', [
    'sass',
    'connect:livepreview',
    'watch'
  ]);

};

【问题讨论】：

尝试添加 grunt.loadNpmTasks('grunt-contrib-watch');
你可能还需要 grunt.loadNpmTasks('grunt-sass');
这是一个自动加载所有 grunt 模块的 grunt 模块：require('load-grunt-tasks')(grunt); 所以我不必单独调用它们。此外，这些任务不会引发错误——就像它们的模块没有加载时那样。

标签： javascript node.js gruntjs

【解决方案1】：

我不知道为什么，但是这个 Gruntfile 现在可以正常工作了。我删除了我的 node_modules 文件夹和 package.json，然后重新初始化了一个新的并安装了这些模块：

"devDependencies": {
"grunt": "^0.4.5",
"grunt-contrib-connect": "^0.8.0",
"grunt-contrib-sass": "^0.8.1",
"grunt-contrib-watch": "^0.6.1",
"load-grunt-tasks": "^1.0.0"
}

它按我的预期工作。

【讨论】：

你应该删除这个问题，因为它不太可能对未来的读者有帮助。
一旦有答案，我就无法删除问题。我试过了。

【解决方案2】：

这对我有用（根据您的情况修改了我的）-我认为“开放”会帮助您：

在我的 gruntfile.settings.json 中：

"webServer": {
    "port": 9000
}

在我的任务之外：

function mountFolder(connect, dir) {
    path = path || require('path');
    return connect.static(path.resolve(dir));
}

然后我的连接看起来像这样：

connect: {
        livereload: {
            options: {
                port: settings.webServer.port,
                hostname: '*',
                middleware: function (connect) {
                    livereload = livereload || require('connect-livereload');
                    return [
                        livereload(),
                        mountFolder(connect, '.'),
                        expireHeaders
                    ];
                }
            }
        },
        web: {
            options: {
                port: settings.webServer.port,
                hostname: '*',
                middleware: function (connect) {
                    return [
                        mountFolder(connect, '.'),
                    ];
                }
            }
        }
},
open: {
    web: {
        path: 'http://localhost:<%= connect.web.options.port %>'
    }
}

最后

grunt.task.run([
    'web',
    'connect:livereload',
    'open:web',
    'watch'
])

否则，我唯一能想到的可能是其他东西已经在使用该端口？

【讨论】：