# gulp-connect > Gulp plugin to run a webserver (with LiveReload) Latest version **5.7.0** (published 2018-12-06) · MIT license · 0 weekly downloads ## Install ```sh npm install gulp-connect pnpm add gulp-connect yarn add gulp-connect bun add gulp-connect ``` ## Health **Score 23/100 (F)** — status: abandoned. Positive: has types package; no vulnerabilities; high quality score. Warnings: low downloads; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 5.7.0 | | Published | 2018-12-06 | | First published | 2014-01-22 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | separate (@types/gulp-connect) | | Module format | CommonJS | | Node | >=0.10.0 | | Dependencies | 9 | | Unpacked size | 194.8 KB | | Known vulnerabilities | 0 (+1 in 1 direct dependencies) | | Install scripts | no | | GitHub stars | 630 | | Maintainers | avevlad, justinmchase | | Keywords | gulpfriendly, connect, livereload, webserver, server | ## Links - npm: https://www.npmjs.com/package/gulp-connect - Repository: https://github.com/avevlad/gulp-connect - Homepage: https://github.com/avevlad/gulp-connect#readme - Issues: https://github.com/avevlad/gulp-connect/issues - npm.io page: https://npm.io/package/gulp-connect ## Dependencies (9) - [send](https://npm.io/package/send.md) ^0.16.2 - [connect](https://npm.io/package/connect.md) ^3.6.6 - [tiny-lr](https://npm.io/package/tiny-lr.md) ^1.1.1 - [fancy-log](https://npm.io/package/fancy-log.md) ^1.3.2 - [map-stream](https://npm.io/package/map-stream.md) ^0.0.7 - [ansi-colors](https://npm.io/package/ansi-colors.md) ^2.0.5 - [serve-index](https://npm.io/package/serve-index.md) ^1.9.1 - [serve-static](https://npm.io/package/serve-static.md) ^1.13.2 - [connect-livereload](https://npm.io/package/connect-livereload.md) ^0.6.0 ## Recent versions - 5.7.0 (latest) — 2018-12-06 - 5.6.1 — 2018-08-28 - 5.5.0 — 2018-02-22 - 5.4.0 — 2018-02-16 - 5.2.0 — 2018-01-04 - 5.1.0 — 2018-01-03 - 5.0.0 — 2016-07-28 - 4.2.0 — 2016-07-17 - 4.1.0 — 2016-06-13 - 4.0.0 — 2016-04-27 - 3.2.3 — 2016-04-26 - 3.2.2 — 2016-03-28 - 3.2.1 — 2016-03-23 - 3.2.0 — 2016-03-20 - 3.1.1 — 2016-03-18 - … 41 more at https://npm.io/package/gulp-connect/versions ## README gulp-connect [![Build Status](http://img.shields.io/travis/AveVlad/gulp-connect.svg?style=flat-square)](https://travis-ci.org/AveVlad/gulp-connect) [![](http://img.shields.io/npm/dm/gulp-connect.svg?style=flat-square)](https://www.npmjs.org/package/gulp-connect) [![](http://img.shields.io/npm/v/gulp-connect.svg?style=flat-square)](https://www.npmjs.org/package/gulp-connect) [![Join the chat at https://gitter.im/AveVlad/gulp-connect](https://badges.gitter.im/AveVlad/gulp-connect.svg)](https://gitter.im/AveVlad/gulp-connect?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) ============== > Gulp plugin to run a webserver (with LiveReload) ## Sponsors gulp-connect is sponsored by [JetBrains](https://www.jetbrains.com/)! ## Install ``` npm install --save-dev gulp-connect ``` ## Usage ```js var gulp = require('gulp'), connect = require('gulp-connect'); gulp.task('connect', function() { connect.server(); }); gulp.task('default', ['connect']); ``` #### LiveReload ```js var gulp = require('gulp'), connect = require('gulp-connect'); gulp.task('connect', function() { connect.server({ root: 'app', livereload: true }); }); gulp.task('html', function () { gulp.src('./app/*.html') .pipe(gulp.dest('./app')) .pipe(connect.reload()); }); gulp.task('watch', function () { gulp.watch(['./app/*.html'], ['html']); }); gulp.task('default', ['connect', 'watch']); ``` #### Start and stop server ```js gulp.task('jenkins-tests', function() { connect.server({ port: 8888 }); // run some headless tests with phantomjs // when process exits: connect.serverClose(); }); ``` #### Multiple server ```js var gulp = require('gulp'), stylus = require('gulp-stylus'), connect = require('gulp-connect'); gulp.task('connectDev', function () { connect.server({ name: 'Dev App', root: ['app', 'tmp'], port: 8000, livereload: true }); }); gulp.task('connectDist', function () { connect.server({ name: 'Dist App', root: 'dist', port: 8001, livereload: true }); }); gulp.task('html', function () { gulp.src('./app/*.html') .pipe(gulp.dest('./app')) .pipe(connect.reload()); }); gulp.task('stylus', function () { gulp.src('./app/stylus/*.styl') .pipe(stylus()) .pipe(gulp.dest('./app/css')) .pipe(connect.reload()); }); gulp.task('watch', function () { gulp.watch(['./app/*.html'], ['html']); gulp.watch(['./app/stylus/*.styl'], ['stylus']); }); gulp.task('default', ['connectDist', 'connectDev', 'watch']); ``` #### http2 support If the [http2](https://www.npmjs.com/package/http2) package is installed and you use an https connection to gulp connect then http 2 will be used in preference to http 1. ## API #### options.root Type: `Array or String` Default: `Directory with gulpfile` The root path #### options.port Type: `Number` Default: `8080` The connect webserver port #### options.host Type: `String` Default: `localhost` #### options.name Type: `String` Default: `Server` The name that will be output when the server starts/stops. #### options.https Type: `Object` Default: `false` Can be any options documented at https://nodejs.org/api/https.html#https_https_createserver_options_requestlistener When https is just set to `true` (boolean), then internally some defaults will be used. #### options.livereload Type: `Object or Boolean` Default: `false` #### options.livereload.port Type: `Number` Default: `35729` Overrides the hostname of the script livereload injects in index.html #### options.livereload.hostname Type: `String` Default: 'undefined' #### options.fallback Type: `String` Default: `undefined` Fallback file (e.g. `index.html`) #### options.middleware Type: `Function` Default: `[]` #### options.debug Type: `Boolean` Default: `false` #### options.index Type: `Boolean or String of a new index pass or Array of new indexes in preferred order` Default: `true` ```js gulp.task('connect', function() { connect.server({ root: "app", middleware: function(connect, opt) { return [ // ... ] } }); }); ``` ## Contributing To contribute to this project, you must have CoffeeScript installed: `npm install -g coffee-script`. Then, to build the `index.js` file, run `coffee -o . -bc src/`. Run `npm test` to run the tests. ## Contributors * [AveVlad](https://github.com/AveVlad) * [schickling](https://github.com/schickling) * [justinmchase](https://github.com/justinmchase) --- _Source: https://npm.io/package/gulp-connect · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._