Question

关于如何使用npm作为构建工具的this篇文章，我想在构建nodejs express web app时实现它。我的节点应用程序是在端口8080上创建的，这是我的server.js文件的简化版本：

var env = process.env.NODE_ENV

var path = require('path');
var express = require('express');
var logger = require('morgan');

var routes = require('./routes');

var app = express();

app.set('port', process.env.PORT || 8080);
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.engine('jade', require('jade').__express)

var Oneday = 86400000;
app.use(express.static(__dirname + '/www', {
    maxAge: env == 'development' ? 0 : Oneday
}));

app.use(logger('dev'));

app.use(express.static(path.join(__dirname, '/public'), {
    maxAge: env == 'development' ? 0 : Oneday
}))

if (env == 'development') {
    // var liveReloadPort = 9091;
    app.use(require('connect-livereload')({
        port: 8080
        // src: "js/"
            // port: liveReloadPort
    }));
}

routes.blog(app);
routes.frontend(app, passport);

app.use(function(err, req, res, next) {
    console.log(err.stack);
    res.status(500).send({
        message: err.message
    })
});

app.listen(app.get('port'));
console.log('Server starting on port: ' + app.get('port'));

我需要重新加载之前正在观看的文件位于www/js。我使用npm作为构建工具，在使用npm启动server.js之前，我启动了一个单独的进程watchify source/js/app.js -v -o wwww/js/bundle.js 我确实检查了watchify是否正常工作，在保存文件时更新。但是一旦文件被更改，就没有livereload。我在控制台中遇到的错误是： Uncaught SyntaxError: Unexpected token < 我可以看到connect-livereload在html中插入了这个脚本：

<script>
//<![CDATA[
document.write('<script src="//' + (location.hostname || 'localhost') + ':8080/livereload.js?snipver=1"><\/script>')
//]]>
</script>
<script src="//localhost:8080/livereload.js?snipver=1"> </script>

我还尝试使用原始文章中提到的live-reload，但没有成功，我不确定它是正确的插件，用live-reload启动服务器，当我已经用快递开始。有什么想法吗？

Answer 1

connect-livereload只会将脚本插入到html中（这样您就不需要浏览器插件了。）

你仍然需要一个单独的livereload服务器，尝试node-livereload，grunt-contrib-connect或grunt-contrib-watch ...因为你想使用npm作为构建工具，所以第一个应该是值得推荐的。 / p>

然后你必须将livereload端口更改为正在运行的live-reload服务器端口（默认端口是35729）：

  app.use(require('connect-livereload')({
    port: 35729
  }));

您尝试过的服务器：实时重新加载应该也可以。

您可以尝试使用以下方式启动它：

live-reload [<path>...] --port=35729 --delay=someDelay

并将connect-livereload选项更改为：

  app.use(require('connect-livereload')({
    src: "localhost:35729"
  }));

Answer 2

此答案显示了如何设置livereload以将对前端文件和后端文件的更改刷新到浏览器。这可能对您有帮助。 https://stackoverflow.com/a/60542132/5032692

在Express节点应用

2 个答案: