gulp-live-serverにtiny-lrを統合

Question

app.jsでエクスプレスアプリを実行するのにノードモジュールgulp-live-serverを使用しています。それは動作しますが、ブラウザはリロードされません。ドキュメントの上にあるリンクのページ下部には、ライブリロードを統合するためにtiny-lr modを使用する必要があります。私は全部を見渡して、具体的にどのようにしてtiny-lrを追加するのか分かりません。私は私のhtmlファイルで尋ねられたようにscriptタグを追加しました。ここgulpfileです：

var gulp = require('gulp'); 
var gls = require('gulp-live-server'); 
var tinylr = require('tiny-lr'); 

var port = 35729; 

gulp.task('serve', function() { 
    var server = gls.new('app.js'); 
    server.start(); 

    tinylr().listen(port, function() { 
     console.log('... Listening on %s ...', port); 
    }) 
}); 

app.js：

var app = require('express')(); 
var http = require('http').Server(app); 

app.get('/', function(req, res){ 
    res.sendFile(__dirname + '/index.html'); 
}); 
app.get('/style.css', function (req, res) { 
    res.sendFile(__dirname + '/style.css'); 
}); 

http.listen(process.env.PORT || 3000, function(){ 
    console.log('listening on *:3000'); 
}); 

私は特急がポート3000でリッスンしている一方で、小さな-LRは35729でリッスンしているという通知をしました。エクスプレスポートを35729に変更すると、それはスローしてエラーとなり、すでにそのポートでリッスンしているサーバーがあると言います。あなたの配慮に感謝します。

Answer 1

これはgulpタスクを必要としません。これをapp.jsファイルで指定できます。

app.Jのファイルにあります。

var tinylr = require('tiny-lr'); app.use (tinylr.middleware({ app: app }))

また、ポートは35729

する必要があります