UNPKG

5.27 kBMarkdownView Raw
1gulp-live-server
2===
3
4[![status][1]][2] [![downloads][3]][4] [![tag][5]][6] [![license][7]][8]
5
6[1]: http://img.shields.io/travis/gimm/gulp-live-server/master.svg?style=flat-square
7[2]: https://travis-ci.org/gimm/gulp-live-server
8
9[3]: http://img.shields.io/npm/dm/gulp-live-server.svg?style=flat-square
10[4]: https://www.npmjs.com/package/gulp-live-server
11
12[5]: https://img.shields.io/github/tag/gimm/gulp-live-server.svg?style=flat-square
13[6]: https://github.com/gimm/gulp-live-server/releases
14
15[7]: http://img.shields.io/badge/license-WTFPL-blue.svg?style=flat-square
16[8]: http://www.wtfpl.net
17
18A handy, light-weight server you're going to love.
19
20- [Install](#install)
21- [Usage](#usage)
22- [API](#api)
23 - [static](#staticfolder-port)
24 - [new](#newscript)
25 - [gls](#glsargs-options-livereload)
26 - [start](#start)
27 - [stop](#stop)
28 - [notify](#notifyevent)
29- [livereload.js](#livereloadjs)
30- [Debug](#debug)
31
32Install
33---
34[![NPM](https://nodei.co/npm/gulp-live-server.png?compact=true)](https://nodei.co/npm/gulp-live-server/)
35
36Usage
37---
38- serve a static folder
39
40 ```js
41 var gulp = require('gulp');
42 var gls = require('gulp-live-server');
43 gulp.task('serve', function() {
44 var server = gls.static();
45 server.start();
46 //live reload changed resource(s)
47 gulp.watch(['static/**/*.css', 'static/**/*.html'], server.notify);
48 });
49 ```
50- fire up your own server
51
52 ```js
53 gulp.task('serve', function() {
54 var server = gls.new('myapp.js');
55 server.start();
56 gulp.watch(['static/**/*.css', 'static/**/*.html'], server.notify);
57 //restart my server
58 gulp.watch('myapp.js', server.start);
59 });
60 ```
61More [examples](https://github.com/gimm/gulp-live-server/tree/master/example)
62
63API
64---
65### static([folder][, port])
66- `folder` - `String|Array` The folder(s) to serve.
67 Use array of strings if there're multi folders to serve.
68 If omitted, defaults to `public/`.
69- `port` - `Number` The port to listen on. Defaults to `3000`.
70- return [gls](#glsargs-options-livereload).
71
72Config new server using the [default server script](https://github.com/gimm/gulp-live-server/blob/master/scripts/static.js), to serve the given `folder` on the specified `port`.
73
74### new(script)
75- `script` - `String` The script file to run.
76- return [gls](#glsargs-options-livereload).
77
78Config new server using the given `script`.
79
80### gls(args[, options][, livereload])
81- `args` - `String|Array` The 2nd param for [ChildProcess.spawn](http://nodejs.org/api/child_process.html#child_process_child_process_spawn_command_args_options).
82- `options` - `Object` The 3rd param for [ChildProcess.spawn](http://nodejs.org/api/child_process.html#child_process_child_process_spawn_command_args_options),
83will be mixin into the default value:
84
85 ```js
86 options = {
87 cwd: undefined
88 }
89 options.env = process.env;
90 options.env.NODE_ENV = 'development';
91 ```
92- `livereload` - `Boolean|Number|Object` The option for tiny-lr server. The default value is `35729`.
93 - `false` - will disable tiny-lr livereload server.
94 - `number` - treated as port number of livereload server.
95 - `object` - used to create tiny-lr server new tinylr.Server(livereload);
96
97**`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.
98**`static` and `new` are just shortcuts for this.**
99Usually, `static` and `new` will serve you well, but you can get more customized server with `gls`.
100
101### start()
102- return [promise](https://github.com/kriskowal/q/wiki/API-Reference) from [Q](https://www.npmjs.com/package/q)
103
104Spawn a new child process based on the configuration.
105- use [`ChildProcess.spawn`](http://nodejs.org/api/child_process.html#child_process_child_process_spawn_command_args_options) to start a node process;
106- use [`tiny-lr`](https://github.com/mklabs/tiny-lr) provide livereload ability;
107
108### stop()
109- return [promise](https://github.com/kriskowal/q/wiki/API-Reference) from [Q](https://www.npmjs.com/package/q)
110
111Stop the server.
112
113### notify([event])
114- `event` - `Event` Event object passed along with [gulp.watch](https://github.com/gulpjs/gulp/blob/master/docs/API.md#cbevent).
115Optional when used with `pipe`.
116
117Tell livereload.js to reload the changed resource(s)
118
119livereload.js
120---
121glup-live-server comes with [tiny-lr](https://github.com/mklabs/tiny-lr/) built in, which works as a livereload server,
122In order to make livereload work with your pages, you still need `livereload.js` loaded with your page, there're 3 options to achieve this:
123- [LiveReload](https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei?hl=en) for Chrome;
124- Use [connect-livereload](https://github.com/intesso/connect-livereload) middleware;
125- Add [livereload.js](https://github.com/livereload/livereload-js) in your page mannully;
126
127Usually, you can check `http://livereload:35729/livereload.js` to see if livereload.js is loaded with your page.
128
129DEBUG
130---
131If you want more output, set the `DEBUG` environment variables to `*` or `gulp-live-server`.