# gulp-webserver

> Gulp plugin to run a local webserver with LiveReload

Latest version **0.9.1** (published 2015-05-04) · MIT license · 0 weekly downloads

## Install

```sh
npm install gulp-webserver
pnpm add gulp-webserver
yarn add gulp-webserver
bun add gulp-webserver
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.9.1 |
| Published | 2015-05-04 |
| First published | 2014-07-05 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 12 |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 352 |
| Author | Johannes Schickling |
| Maintainers | schickling |
| Keywords | gulpplugin, webserver, connect, livereload |

## Links

- npm: https://www.npmjs.com/package/gulp-webserver
- Repository: https://github.com/schickling/gulp-webserver
- Issues: https://github.com/schickling/gulp-webserver/issues
- npm.io page: https://npm.io/package/gulp-webserver

## Dependencies (12)

- [open](https://npm.io/package/open.md) ^0.0.5
- [watch](https://npm.io/package/watch.md) ^0.11.0
- [connect](https://npm.io/package/connect.md) ^3.0.1
- [isarray](https://npm.io/package/isarray.md) 0.0.1
- [tiny-lr](https://npm.io/package/tiny-lr.md) 0.1.4
- [through2](https://npm.io/package/through2.md) ^0.5.1
- [gulp-util](https://npm.io/package/gulp-util.md) ^2.2.19
- [node.extend](https://npm.io/package/node.extend.md) ^1.0.10
- [serve-index](https://npm.io/package/serve-index.md) ^1.1.4
- [serve-static](https://npm.io/package/serve-static.md) ^1.3.0
- [proxy-middleware](https://npm.io/package/proxy-middleware.md) ^0.5.0
- [connect-livereload](https://npm.io/package/connect-livereload.md) ^0.4.0

## Recent versions

- 0.9.1 (latest) — 2015-05-04
- 0.9.0 — 2014-12-14
- 0.8.8 — 2014-12-05
- 0.8.7 — 2014-11-04
- 0.8.6 — 2014-11-01
- 0.8.5 — 2014-10-31
- 0.8.4 — 2014-10-25
- 0.8.3 — 2014-10-01
- 0.8.2 — 2014-09-26
- 0.8.1 — 2014-09-15
- 0.8.0 — 2014-09-06
- 0.7.2 — 2014-09-02
- 0.7.1 — 2014-09-01
- 0.7.0 — 2014-08-24
- 0.6.0 — 2014-08-06
- … 10 more at https://npm.io/package/gulp-webserver/versions

## README

gulp-webserver [![Build Status](http://img.shields.io/travis/schickling/gulp-webserver.svg?style=flat)](https://travis-ci.org/schickling/gulp-webserver) [![](http://img.shields.io/npm/dm/gulp-webserver.svg?style=flat)](https://www.npmjs.org/package/gulp-webserver) [![](http://img.shields.io/npm/v/gulp-webserver.svg?style=flat)](https://www.npmjs.org/package/gulp-webserver)
==============

> Streaming gulp plugin to run a local webserver with LiveReload

##### Hint: This is a rewrite of [gulp-connect](https://github.com/AveVlad/gulp-connect/)

## Install

```sh
$ npm install --save-dev gulp-webserver
```

## Usage

The `gulp.src('root')` parameter is the root directory of the webserver. Multiple directories are possible.

```js
var gulp = require('gulp');
var webserver = require('gulp-webserver');

gulp.task('webserver', function() {
  gulp.src('app')
    .pipe(webserver({
      livereload: true,
      directoryListing: true,
      open: true
    }));
});
```

## Options

Key | Type | Default | Description |
--- | --- | --- | --- |
`host` | String | `localhost` | hostname of the webserver
`port` | Number | `8000` | port of the webserver
`path` | String | `/` | path to the webserver
`livereload` | Boolean/Object | `false` | whether to use livereload. For advanced options, provide an object. You can use the 'port' property to set a custom live reload port and the `filter` function to filter out files to watch. The object also needs to set `enable` property to true (e.g. `enable: true`) in order to activate the livereload mode. It is off by default.
`directoryListing` | Boolean/Object | `false` | whether to display a directory listing. For advanced options, provide an object with the 'enable' property set to true. You can use the 'path' property to set a custom path or the 'options' property to set custom [serve-index](https://github.com/expressjs/serve-index) options.
`fallback` | String | `undefined` | file to fall back to (relative to webserver root)
`open` | Boolean/String | `false` | open the localhost server in the browser. By providing a String you can specify the path to open (for complete path, use the complete url `http://my-server:8080/public/`) .
`https` | Boolean/Object | `false` | whether to use https or not. By default, `gulp-webserver` provides you with a development certificate but you remain free to specify a path for your key and certificate by providing an object like this one: `{key: 'path/to/key.pem', cert: 'path/to/cert.pem'}`.
`middleware` | Function/Array | `[]` | a connect middleware function or a list of middleware functions
`proxies` | Array | `[]`| a list of proxy objects.  Each proxy object can be specified by `{source: '/abc', target: 'http://localhost:8080/abc', options: {headers: {'ABC_HEADER': 'abc'}}}`.

## FAQ

#### Why can't I reach the server from the network?

**Solution**: Set `0.0.0.0` as `host` option.

#### How can I use `html5Mode` for my single page app with this plugin?

**Solution**: Set the `index.html` of your application as `fallback` option. For example:

```js
gulp.task('webserver', function() {
  gulp.src('app')
    .pipe(webserver({
      fallback: 'index.html'
    }));
});
```

#### How can I pass a custom filter to livereload?

**Solution**: Set `enable: true` and provide filter function in `filter:` property of the livereload object. For example:

```js
gulp.task('webserver', function() {
  gulp.src('app')
    .pipe(webserver({
      livereload: {
        enable: true, // need this set to true to enable livereload
        filter: function(fileName) {
          if (fileName.match(/.map$/)) { // exclude all source maps from livereload
            return false;
          } else {
            return true;
          }
        }
      }
    }));
});
```

#### How can I kill the running server?

**Solution**: Either by pressing `Ctrl + C` or programmatically like in this example:

```js
var stream = gulp.src('app').pipe(webserver());
stream.emit('kill');
```

## License

[MIT License](http://opensource.org/licenses/MIT)

---
_Source: https://npm.io/package/gulp-webserver · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
