-
-
Save sogko/b53d33d4f3b40d3b4b2e to your computer and use it in GitHub Desktop.
'use strict'; | |
// simple express server | |
var express = require('express'); | |
var app = express(); | |
var router = express.Router(); | |
app.use(express.static('public')); | |
app.get('/', function(req, res) { | |
res.sendfile('./public/index.html'); | |
}); | |
app.listen(5000); |
'use strict'; | |
var gulp = require('gulp'); | |
var browserSync = require('browser-sync'); | |
var nodemon = require('gulp-nodemon'); | |
gulp.task('default', ['browser-sync'], function () { | |
}); | |
gulp.task('browser-sync', ['nodemon'], function() { | |
browserSync.init(null, { | |
proxy: "http://localhost:5000", | |
files: ["public/**/*.*"], | |
browser: "google chrome", | |
port: 7000, | |
}); | |
}); | |
gulp.task('nodemon', function (cb) { | |
var started = false; | |
return nodemon({ | |
script: 'app.js' | |
}).on('start', function () { | |
// to avoid nodemon being started multiple times | |
// thanks @matthisk | |
if (!started) { | |
cb(); | |
started = true; | |
} | |
}); | |
}); |
<html> | |
<head> | |
<link rel="stylesheet" href="site.css"/> | |
</head> | |
<body> | |
<!-- some dummy non-conforming quick dirty html code to test browser-sync. dont't judge me. --> | |
<b>lorem</b> ipsum upsum dumsum | |
</body> | |
</html> | |
<!-- put this under /public/* --> |
{ | |
"name": "gulp-expressjs-nodemon-browser-sync", | |
"version": "0.0.0", | |
"description": "", | |
"main": "app.js", | |
"scripts": { | |
"test": "echo \"Error: no test specified\" && exit 1" | |
}, | |
"author": { | |
"name": "Hafiz Ismail", | |
"email": "hafiz@wehavefaces.net", | |
"url": "http://wehavefaces.net" | |
}, | |
"license": "ISC", | |
"dependencies": { | |
"express": "^4.8.2" | |
}, | |
"devDependencies": { | |
"browser-sync": "^1.3.3", | |
"gulp": "^3.8.7", | |
"gulp-nodemon": "^1.0.4" | |
} | |
} |
/* some css */ | |
/* put this under /public/* */ | |
body { | |
font-family: 'Helvetica'; | |
color: red; | |
font-size:24px; | |
} |
Works great! Thx!
Works great! Thx!
Does someone knows how to change the default behaviour of browser-sync which automatically delivers index.html as the root directory?
I tried changing that behaviour by simply defining a route inside my app.js but somehow it gets ignored.
Nice job, but i have a question?
It's just working when i access http://localhost:3000, when I access http://localhost:3000/users it not working, help me?
Looks promising but it breaks after running for the first time with this error:
`
Error: listen EADDRINUSE :::5000
at Object._errnoException (util.js:1022:11)
at _exceptionWithHostPort (util.js:1044:20)
at Server.setupListenHandle [as _listen2] (net.js:1351:14)
at listenInCluster (net.js:1392:12)
at Server.listen (net.js:1476:7)
at Function.listen (C:\xampp\htdocs\ndondo\aug2018\jobBoard\node_modules\express\lib\application.js:618:24)
at Object.<anonymous> (C:\xampp\htdocs\ndondo\aug2018\jobBoard\index.js:36:5)
at Module._compile (module.js:643:30)
at Object.Module._extensions..js (module.js:654:10)
at Module.load (module.js:556:32)
[18:01:36] [nodemon] app crashed - waiting for file changes before starting
`
Any ideas why ?
Heres a 2019 way of setting up the gulpfile since that code no longer works for running multiple tasks
const gulp = require("gulp");
const browserSync = require("browser-sync");
var nodemon = require("gulp-nodemon");
gulp.task("nodemon", cb => {
let started = false;
return nodemon({
script: "server.js"
}).on("start", () => {
if (!started) {
cb();
started = true;
}
});
});
gulp.task(
"browser-sync",
gulp.series("nodemon", () => {
browserSync.init(null, {
proxy: "http://localhost:7000",
files: ["public/**/*.*"],
port: 9000
});
})
);
gulp.task("serve", gulp.series("browser-sync", () => {}));
Thanks @Dmitri801, works great!
Works great! Thx!