Serve a static folder(gls.script<'scripts/static.js'> is used as server script)
vargulp=require('gulp');vargls=require('gulp-live-server');gulp.task('serve',function(){//1. serve with default settingsvarserver=gls.static();//equals to gls.static('public', 3000);server.start();//2. serve at custom portvarserver=gls.static('dist',8888);server.start();//3. serve multi foldersvarserver=gls.static(['dist','.tmp']);server.start();//use gulp.watch to trigger server actions(notify, start or stop)gulp.watch(['static/**/*.css','static/**/*.html'],function(file){server.notify.apply(server,[file]);});});
Serve with your own script file
gulp.task('serve',function(){//1. run your script as a servervarserver=gls.new('myapp.js');server.start();//2. run script with cwd args, e.g. the harmony flagvarserver=gls.new(['--harmony','myapp.js']);//this will achieve `node --harmony myapp.js`//you can access cwd args in `myapp.js` via `process.argv`server.start();//use gulp.watch to trigger server actions(notify, start or stop)gulp.watch(['static/**/*.css','static/**/*.html'],function(file){server.notify.apply(server,[file]);});gulp.watch('myapp.js',server.start.bind(server));//restart my server// Note: try wrapping in a function if getting an error like `TypeError: Bad argument at TypeError (native) at ChildProcess.spawn`gulp.watch('myapp.js',function(){server.start.bind(server)()});});
Customized serving with gls
gulp.task('serve',function(){//1. gls is the base for `static` and `new`varserver=gls([gls.script,'static',8000]);//equals gls.new([gls.script, 'static', 8000]);//equals gls.static('static', 8000);server.start();//2. set running options for the server, e.g. NODE_ENVvarserver=gls('myapp.js',{env: {NODE_ENV: 'development'}});server.start();//3. customize livereload server, e.g. port numbervarserver=gls('myapp.js',undefined,12345);varpromise=server.start();//optionally handle the server process exitingpromise.then(function(result){//log, exit, re-start, etc...});//4. start with coffee-script executable e.g. installed with npmvarserver=gls('myapp.coffee');server.start('node_modules/coffee-script/bin/coffee');//use gulp.watch to trigger server actions(notify, start or stop)gulp.watch(['static/**/*.css','static/**/*.html'],function(file){server.notify.apply(server,[file]);});gulp.watch('myapp.js',server.start.bind(server));//restart my server// Note: try wrapping in a function if getting an error like `TypeError: Bad argument at TypeError (native) at ChildProcess.spawn`gulp.watch('myapp.js',function(){server.start.bind(server)()});});
API
static([folder][, port])
folder - String|Array The folder(s) to serve.
Use array of strings if there're multi folders to serve.
If omitted, defaults to public/.
port - Number The port to listen on. Defaults to 3000.
livereload - Boolean|Number|Object The option for tiny-lr server. The default value is 35729.
false - will disable tiny-lr livereload server.
number - treated as port number of livereload server.
object - used to create tiny-lr server new tinylr.Server(livereload);
gls here is a reference of var gls = require('gulp-live-server'). It aims to assemble configuration for the server child process as well as the tiny-lr server.
static and new are just shortcuts for this.
Usually, static and new will serve you well, but you can get more customized server with gls.
start([execPath])
execPath - String The executable that is used to start the server. If none is given the current node executable is used.
return promise from Q, resolved with the server process exits.
Spawn a new child process based on the configuration.
event - Event Event object passed along with gulp.watch.
Optional when used with pipe.
Tell livereload.js to reload the changed resource(s)
livereload.js
gulp-live-server comes with tiny-lr built in, which works as a livereload server. livereload.js is served by tiny-lr, but in order to get it loaded with your page, you have 3 options( to inject<script src="//localhost:35729/livereload.js"></script> into your page):
Usually, if http://localhost:35729/livereload.js is accessible, then your livereload server is ok, if you don't have the script tag for livereload.js in you page, you've problem with either your chrome plugin or the connect-livereload middle-ware as mentioned above.
DEBUG
If you want more output, set the DEBUG environment variables to * or gulp-live-server.
请发表评论