Question

我有一个Handlebars驱动的模板应用程序，它是通过一个简单的基于Express的Node.js服务器生成的。我一直在努力将其设置为使用Grunt进行重新加载，以便于开发。

我已经阅读过无数的博客和GitHub关于设置实时重新加载的自述文件;事实证明，这是一个非常周期性的杂事（一页链接到另一页，导致另一页，另一页，等等）。我读到的任何内容都不一致，所有内容似乎都支持实时重新加载，而没有真正解释如何做到这一点 - 找到明确的方法来实现这一点真的很困难！

但是，我通过以下方式获得了一个工作，自我重新加载，快速驱动的项目：

Gruntfile.js

var files = [
    'markup/*',
    'examples/*'
]

module.exports = function(grunt) {
    require('load-grunt-tasks')(grunt)
    grunt.initConfig({
        express: {
            options: {
                port: 8080
            },
            dev: {
                options: {
                    port: 8080,
                    script: 'server.js',
                    background: true
                }
            }
        },
        watch: {
            options: {
                livereload: true
            },
            express: {
                files: files,
                tasks: ['express:dev'],
                options: {
                    spawn: false
                }
            },
        },
    })
    grunt.registerTask('default', ['express:dev', 'watch'])
}

的package.json

...
"devDependencies": {
    "connect-livereload": "^0.5.4",
    "grunt": "~0.4.5",
    "grunt-contrib-watch": "^1.0.0",
    "grunt-express-server": "^0.5.3",
    "load-grunt-tasks": "^3.5.0"
}
...

在我的Express应用中，server.js：

// Live reload
app.use(require('connect-livereload')({
    port: 35729
}))

// Server
var server = app.listen(process.env.PORT || 8080, function() {
    console.log("Express app started on port " + server.address().port)
})

在我的Handlebars驱动的index.html模板中：

<script src="//localhost:35729/livereload.js"></script>

现在一切正常 - 我只是从项目目录运行$ grunt，页面加载;然后，当我在后端更改文件时，它会按预期重新加载。

问题：

当我用grunt启动项目时，会发生以下情况：

> $ grunt
Running "express:dev" (express) task
Starting background Express server
Express app started on port 8080

Running "watch" task
Waiting...
>> File "components/el.html" changed.

Running "express:web" (express) task
Stopping Express server
Starting background Express server
>> File "components/el.html" changed.

Running "express:dev" (express) task
Stopping Express server
Starting background Express server
Express app started on port 3000

Running "watch:web" (watch) task
Completed in 0.491s at Thu May 19 2016 12:37:33 GMT-0700 (PDT) - Waiting...
Express app started on port 8080

Running "watch" task
Completed in 0.484s at Thu May 19 2016 12:37:33 GMT-0700 (PDT) - Waiting...

请注意Express应用现在如何监听 :3000和:8080？发生了什么事？我假设我的gruntfile中的某些东西没有设置好吗？

Grunt + Express + LiveReload在默认端口3000

0 个答案: