Code Monkey home page Code Monkey logo

gulp-connect's Introduction

gulp-connect Build Status Join the chat at https://gitter.im/AveVlad/gulp-connect

Gulp plugin to run a webserver (with LiveReload)

Sponsors

gulp-connect is sponsored by JetBrains!

Install

npm install --save-dev gulp-connect

Usage

var gulp = require('gulp'),
  connect = require('gulp-connect');

gulp.task('connect', function() {
  connect.server();
});

gulp.task('default', ['connect']);

LiveReload

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(connect.reload());
});

gulp.task('watch', function () {
  gulp.watch(['./app/*.html'], ['html']);
});

gulp.task('default', ['connect', 'watch']);

Start and stop server

gulp.task('jenkins-tests', function() {
  connect.server({
    port: 8888
  });
  // run some headless tests with phantomjs
  // when process exits:
  connect.serverClose();
});

Multiple server

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(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 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

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

gulp-connect's People

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.