遵循gulp规范的用法部分,我正在尝试设置一个带有livereload的快速开发服务器。我有单独的任务来执行javascript丑陋化、将scss转换为css和minify html,所以我只需要从我的dist文件夹中运行服务器。
到目前为止,一切都正常,除了livereload (浏览器没有重新加载css更改)。
我的任务是:
gulp.task('server', function() {
server.run(['main.js'],[],[1337]);
gulp.watch(['/dist/**/*.html'], server.notify);
gulp.watch(['/dist/**/*.css'], server.notify);
gulp.watch(['/dist/**/*.js'], server.notify);
gulp.watch(['/dist/assets/images/*.*'], server.notify);
});main.js:
// packages
var express = require('express');
var app = express();
var bodyParser = require('body-parser');
var morgan = require('morgan');
var path = require('path');
//app configuration
// body parser
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());
//CORS requests
app.use(function(req, res, next) {
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Methods', 'GET, POST');
res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With, content-type, Authorization');
next();
});
//log all requests to console
app.use(morgan('dev'));
app.use(express.static(__dirname + '/dist'));
//catchall route
app.get('*', function(req, res) {
res.sendFile(path.join(__dirname + '/dist/index.html'));
});
//start the server
app.listen(1337);
console.log('Running on port 1337!');在运行gulp服务器时,我在控制台中得到以下消息:
听着35729 .在1337港口运行!
我可以在浏览器中加载页面,但是它不会自动刷新代码更改。
我做错了什么?
发布于 2017-05-08 22:00:32
你正在解决你的问题,我知道这篇文章有9个月的历史,但是如果它对任何人有用的话,我会发布一个解决方案,它为我工作,我和你有同样的问题,这是我的解决方案:
gulp.task('webserver', function() {
var server = gls(['app.js','public', 3000], undefined, {});
server.start();
//Watch files
gulp.watch([paths.images], function (file) {
gulp.start('custom-images');
server.notify.apply(server, [file]);
});
gulp.watch([paths.scripts], function (file) {
gulp.start('custom-js');
server.notify.apply(server, [file]);
});
gulp.watch([paths.custom_styles], function (file) {
gulp.start('custom-styles');
server.notify.apply(server, [file]);
});
gulp.watch([paths.templates], function (file) {
gulp.start('custom-templates');
server.notify.apply(server, [file]);
});
gulp.watch([paths.index], function (file) {
gulp.start('usemin');
server.notify.apply(server, [file]);
});
gulp.watch([paths.build_index], function (file) {
gulp.start('convert-index');
server.notify.apply(server, [file]);
});
});正如您可以看到的,问题是,据我所知,您需要将回调函数传递给gulp.watch(),然后调用server.notify.apply(服务器,文件),注意您正在传递服务器和您修改的文件,我想这是因为您需要告诉liveReload这是您更改的文件。希望能帮上忙,干杯。西格弗里德
我刚刚找到了这个,我认为这也是一个很好的解决方案:https://stackoverflow.com/a/27488331/4613549
https://stackoverflow.com/questions/38453575
复制相似问题