-
-
Save dstroot/22525ae6e26109d3fc9d to your computer and use it in GitHub Desktop.
/** | |
* World's simplest express server | |
* - used to serve index.html from /public | |
*/ | |
var express = require('express'); | |
var serveStatic = require('serve-static'); | |
var app = express(); | |
app.use(serveStatic(__dirname + '/public')); | |
app.listen(3000); | |
console.log('Express listening on port 3000'); |
/** | |
* Module Dependencies | |
*/ | |
var gulp = require('gulp'); | |
var browserSync = require('browser-sync'); | |
var reload = browserSync.reload; | |
var nodemon = require('gulp-nodemon'); | |
/** | |
* Gulp Tasks | |
*/ | |
gulp.task('browser-sync', ['nodemon'], function() { | |
browserSync({ | |
proxy: "localhost:3000", // local node app address | |
port: 5000, // use *different* port than above | |
notify: true | |
}); | |
}); | |
gulp.task('nodemon', function (cb) { | |
var called = false; | |
return nodemon({ | |
script: 'app.js', | |
ignore: [ | |
'gulpfile.js', | |
'node_modules/' | |
] | |
}) | |
.on('start', function () { | |
if (!called) { | |
called = true; | |
cb(); | |
} | |
}) | |
.on('restart', function () { | |
setTimeout(function () { | |
reload({ stream: false }); | |
}, 1000); | |
}); | |
}); | |
gulp.task('default', ['browser-sync'], function () { | |
gulp.watch(['public/*.html'], reload); | |
}); |
{ | |
"private": true, | |
"dependencies": { | |
"express": "^4.5.1", | |
"serve-static": "^1.3.0" | |
}, | |
"devDependencies": { | |
"browser-sync": "^1.2.1", | |
"gulp": "^3.8.6", | |
"gulp-nodemon": "^1.0.4" | |
} | |
} |
Working sweet here. Thanks!
Ps.: using "browser-sync": "2.18.6", "gulp-nodemon": "2.2.1", "express": "4.13.3"
@Jakobud Did you ever get your *.js files to update in the browser? I am experiencing the same issue.
Works great!I had to made some adjusts in order to make it run with a express standard demo.
The following:
on package.json, change start to this:
"scripts": {
"start": "gulp"
}
and in gulpfile.js @line 25
script: './bin/www',
that './bin/www' is the standard reference for express.
Perhaps seems silly, but I'm pretty sure there are a bunch of noobs like me seeking for something like the code you made.
Thanks a lot for sharing! (=
Thanks! Just work fine!
I have used the same code, but my first page which is named as 'main.jade' is not being rendering. But when I am going to other url's like /dasboard it opens correctly. Should I name my starting file name as index.jade, will that help
Thanks bro.work fine
`
/**
- Module Dependencies
*/
var gulp = require('gulp');
var browserSync = require('browser-sync');
var reload = browserSync.reload;
var nodemon = require('gulp-nodemon');
/**
- Gulp Tasks
*/
gulp.task('nodemon', function (cb) {
var called = false;
return nodemon({
script: './bin/www',
ignore: [
'gulpfile.js',
'node_modules/'
]
})
.on('start', function () {
if (!called) {
called = true;
cb();
}
})
.on('restart', function () {
setTimeout(function () {
reload({ stream: false });
}, 1000);
});
});
gulp.task('browser-sync', gulp.series('nodemon', function() {
browserSync({
proxy: "localhost:3000", // local node app address
port: 5000, // use different port than above
notify: true
});
}));
gulp.task('default', gulp.series('browser-sync', function () {
gulp.watch(['public/*.html'], reload);
}));
`
I dont know how to format the code here. This works in gulp 4.0 and up
This did the trick for me on gulp 4.0.2:
'use strict';
var gulp = require('gulp');
var browserSync = require('browser-sync');
var nodemon = require('gulp-nodemon');
gulp.task('nodemon', function (cb) {
var started = false;
return nodemon({
script: 'server.js',
ignore: [
'gulpfile.js',
'node_modules/'
]
}).on('start', function () {
if (!started) {
cb();
started = true;
}
});
});
gulp.task('browser-sync', gulp.series('nodemon', function() {
browserSync.init(null, {
proxy: "http://localhost:3000",
files: ["public/*.html"],
port: 5000,
});
}));
gulp.task('default', gulp.series('browser-sync', function () {
}));
Code adapted from: https://gist.github.com/sogko/b53d33d4f3b40d3b4b2e and @alaksandarjesus
Thanks!