a simple web server without caching for development

Developer Web Server

grunt-devserver provides a simple way to quickly get a development server serving up your content with

  • run from the command line or Grunt 0.4.x
  • no caching content
  • CORS headers for cross-domain requests
  • logs requests to console
  • quickly configure https server
  • redefine your middleware in configuration

As a developer I needed a lightweight way to serve up client-side applications and content in isolation from a larger server application. Something that supported a rapid workflow and integrated with my tools.

Install it from the command line into your project

npm install grunt-devserver --save-dev

Or install it globally

npm install grunt-devserver -g

Once grunt-devserver has been installed globally you can run it from any folder by typing devserver

Command line options:

-t, --type (server type) http|https (default is http)
-p, --port (port number) listen on this port
-f, --folder (full path to a folder) serves this folder
-s, --server start a server as defined in the configuration
--cache (method) the method to return in the Cache-Control HTTP header. Default is no-cache.
--file (filename) loads a js/json configuration file

For more information on configuration files see Configuration Files

From Grunt

To start a server through grunt you need a devserver configuration in your Gruntfile.js and tell grunt to load grunt-devserver as an available task. For more information see Configuring Tasks.

    var config = {devserver: {server: {}}}

and execute using:

    grunt devserver

Now you can add the following options:

devserver: { options: { 'type' : <string> (http|https defaults to http)
                      , 'port' : <port number> (defaults to 8888)
                      , 'base' : <directory> (defaults to .)
                      , 'cache' : <string> (defaults to 'no-cache')
                      , 'httpsOptions' : <object> https.createServer options
                      , 'file' : <filename>
                      , 'async' : <boolean> (defaults to true)
                      , 'middleware' : <array> || <function> (defaults to predefined middleware)

NOTE: Starting multiple devservers requires setting the async option to false so that other server tasks may be processed. async can also be useful when a server is needed to support integration or functional testing.

See the Configuration section for more information.

You can also use devserver directly as a module in your project.

    var devserver = require('grunt-devserver')
      , options = { type: "http", port: 8000 }
      , serverStarted = devserver(options)
    serverStarted.then(function(server) {
        // TODO something awesome

As a developer tool integration is extremely important. If you are using a Jetbrains IDE like WebStorm here are instructions to start a devserver directly in your IDE by adding an entry to your External Tools:

  1. Go to Preferences > External Tools
  2. Click Add
  3. Fill in the form:
    1. name: http
    2. group: devserver
    3. program: /usr/local/bin/devserver
    4. paramters: --port $Prompt$
    5. working directory: $FileDir$
  4. Hit OK. You should now be able to right-click on any folder and start your devserver!

Q: I am getting "env: node: No such file or directory"

You need to add node to your path. On a Mac 10.8.x or later see launchctl man page for more information.

  1. From a terminal run sudo vim /etc/launchd.conf
  2. Add setenv PATH /usr/bin:/bin:/usr/sbin:/sbin:/usr/local/bin
  3. Reboot


Configuration files provide you with the same functionality as a grunt configuration and can easily be shared across projects or used from the command-line.

The type of server

Type: string
Default: http
Command line: -t, --type

The port where the server will respond

type: number
default: 8888
command line: -p, --port

The base directory of the web server. This is where files will be served. This configuration is passed to the serve-index middleware.

type: String
default: '.'
command line: -f, --folder

The type of caching mechanism to use. The noCacheHeaders middleware uses this value to add Cache-Control headers to the HTTP response.

type: String
default: no-cache
command line: --cache

httpsOptions are passed directly through to node's https.createServer() method. Read the docs for more information. This is ignored unless the server type is specified as https. When a signing certificate is not present, one will be automatically generated.

type: object
default: none

As external configuration file. See Using Configuration Files for samples on how to use file configurations with devserver

type: string
default: none
command line: --file

async if set to true it will keep Grunt from terminating (see Grunt Tasks)

type: boolean
default: true

Redefines the middleware stack to be used by the server.

type: array or function
default: @see model/CommonConfig.defaultMiddleware

Example: redefine the middleware to log the request and send a hello world message

{ options: { middleware: [ morgan()
                         , function(req, res, next) {
                            res.send('Hello world!').end(200)

Routes can also be used to define specific middleware handlers

var route = require('devserver').middleware.route
var morgan = require('morgan')
function getName(req, res, next) {
    // retrieve the user name
function putName(req, res, next) {
    // update the user name
{ options: { middleware: [ morgan()
                         , route('/name/:id').get(getName).put(putName)

When a property exists in the grunt/command-line configuration and in the configuration file, the grunt/command-line option always overrides the file options.

A example devserverrc file

{ "options": { "type" : "http"
             , "port" : 8888

When this file is loaded from the command-line

    devserver --file "./devserverrc" --port 4321 --cache "no-store"

The resulting configuration used by devserver

{ "options": { "type" : "http"
             , "port" : 4321
             , "cache" : "no-store"