gruntjs - 咕噜声 : `contrib-watch` Fire livereload event after `grunt-nodemon` has restarted when server-side `.coffee` files are compiled

Question

我一直在使用 Grunt.js 和一些插件时遇到问题，特别是:grunt-contrib-watch、grunt-nodemon 和 grunt-贡献咖啡。这两天我一直在努力解决这个问题，但我认为我对 Grunt 的了解目前还不足以解决这个问题。

我遇到的问题很简单，我希望我的服务器端 .coffee 文件进行编译，然后让 nodemon 重新启动服务器，然后只让 livereload 工作。现在，除了服务器端 coffee 文件之外，Livereload 可以正常工作。 contrib-watch 检测到变化，运行 coffee 并触发 livereload 事件，但随后 nodemon 重新启动。

有没有办法让 nodemon 在页面重新加载之前重新启动，以便我在屏幕上看到的内容与我的服务器端代码中发生的事情是最新的？

我已经看到了在单独的终端选项卡中运行 nodemon 的选项，但我在 Windows 上并且更愿意为此目的让一个终端运行并且是整个我使用 grunt-concurrent 的原因。

这是我的 Gruntfile，它还处于早期阶段(因为我试图弄清楚这一切)。如果您希望我将其编译为 JavaScript，请留下评论并提出要求，我很乐意。

module.exports = (grunt) ->

  # configuration
  grunt.initConfig
    pkg: grunt.file.readJSON 'package.json'

    # watch task
    watch:
      css:
        files: ['src/assets/styles/**/*.styl']
        tasks: ['stylus']
        options:
          livereload: true
      coffee:
        files: ['src/**/*.coffee']
        tasks: ['coffee']
      js:
        files: ['**/*.js']
        options:
          livereload: true
      jade:
        files: ['views/**/*.jade']
        options:
          livereload: true

    # compile coffeescript to javascript
    coffee:
      compile:
        options:
          sourceMap: true
        files: [
          expand: true
          cwd: 'src/'
          src: ['**/*.coffee']
          dest: ''
          ext: '.js'
        ]

    # compile stylus to css
    stylus:
      compile:
        files: [
          expand: true
          cwd: 'src/assets/styles/'
          src: ['**/*.styl']
          dest: 'assets/styles/'
          ext: '.css'
        ]

    # run server
    nodemon:
      dev:
        options:
          file: 'server.js'
          watchedExtensions: ['js', 'json']
          ignoredFiles: [
            'assets/**',
            'node_modules/**',
            '**/.js.map'
          ]

    # run tasks concurrently for fast builds
    concurrent:
      first:
        tasks: ['coffee', 'stylus']
        options:
          logConcurrentOutput: true
      second:
        tasks: ['nodemon', 'watch']
        options:
          logConcurrentOutput: true

  # load dependencies
  require('load-grunt-tasks') grunt

  # register tasks
  grunt.registerTask 'default', [
    'concurrent:first',
    'concurrent:second'
  ]

Answer 1

我自己没有用过这个，但我不久前遇到过它:grunt-rerun。与 watch 任务结合使用，你可以暂停一个长时间运行的任务，比如 express(但可能也适用于 nodemon)，运行一些任务，然后再次启动任务。示例配置如下所示:

grunt.initConfig({
  watch: {
      dev: {
        files: ['server/*.js'],

        //Note the :go flag used for sending the reload message to the rerun server
        tasks: ['clean','rerun:dev:express:go']
      },
    },
    express: {
        dev: {
            options: {
                port: 3000,
                bases: ['/public'],
                keepalive: true,
                server: path.resolve('./server/app.js')
            }
        }
    },
    // Configuration to be run (and then tested).
    rerun: {
      dev: {
        options: {
          tasks: ['express']
        },
      },
    }
})

https://npmjs.org/package/grunt-rerun

我不太确定实时重新加载的事情。我的猜测是因为它关闭了进程，通过生成一个新进程它会重新加载页面，但我个人没有使用过它所以我不确定。

第二种选择是，使用支持多个选项卡的命令提示符，例如 Console .我是 Mac 用户，所以我使用 iTerm 2它有多个 Pane ；大多数时候我每个项目有四个打开的，用于 watch，testem，一个 php 服务器和一个用于其他所有东西的 shell。您可能会发现这要快得多，麻烦也少得多。

只是对 Coffeescript 的快速说明，许多 JavaScript 开发人员不使用它，因此为了让更多的受众了解您的源代码，最好在 你发表你的问题。