使用connect-livereload在一個Express節點應用

下面就如何使用NPM作爲構建工具this偉大的文章，我想建立一個明確的NodeJS web應用程序時，來實現它。我節點應用程序是在8080端口上創建的，這是我的server.js文件的簡化版本：使用connect-livereload在一個Express節點應用

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作爲構建工具，在啓動server.js與npm之前，我啓動了一個單獨的進程，它的確如此watchify source/js/app.js -v -o wwww/js/bundle.js 我確實檢查了watchify能否正常工作，並在保存我的文件時進行更新。但是一旦文件被改變，就沒有livereload。我在控制檯得到的錯誤是： Uncaught SyntaxError: Unexpected token < ，我可以看到連接，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在原來的文章，但沒有成功mentionned並且我不確定它是否是正確的插件，因爲我已經用express啓動了一個服務器，所以我使用這個插件作爲live-reload。任何想法？

來源

2015-06-24 Bondifrench

connect-livereload只是插入腳本到HTML（這樣你就不會需要一個瀏覽器插件）。

您仍然需要單獨的livereload服務器，請嘗試node-livereload，grunt-contrib-connect或grunt-contrib-watch ...因爲您想使用npm作爲構建工具，所以第一個應該是值得推薦的。

，那麼你就必須在livereload端口更改爲正在運行的服務器livereload端口（默認端口是35729）：

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

您嘗試的服務器：livereload應該正常工作。

你可以嘗試啓動它：

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

和Connect-livereload選項更改爲：

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

來源

2015-06-24 10:15:33 andineck

謝謝。你帶領我去解決問題。什麼解決了它是從'live-reload --port 9091 www/js /'開始的，並且我在這裏指出的端口是我在connect-livereload app.use（require（'connect-livereload'）（ { port：9091 }））;' – Bondifrench

@Bondifrench很高興它有幫助。 – andineck

使用connect-livereload在一個Express節點應用

回答

相關問題