This guide assumes you have a recent version of Node.js and Grunt installed already.

Deploying a Grunt project

To get started, running the following command within your Grunt project:

npm install --save-dev grunt-surge

This will save the grunt-surge plugin as a development dependency within your Grunt project. Now, you’ll be able to build deployment right into your Gruntfile.

Adding deployment to your Gruntfile

Whether you are building a client side app with Angular, a static site using Grunt and Jekyll together, or doing something else entirely—building the ability to deploy right into your Gruntfile can help you deploy more often and reduce the setup time for other team members.

Here’s an example Gruntfile.js using grunt-surge:

module.exports = function(grunt) {

  grunt.initConfig({

    surge: {
      'Your Project Name': {
        options: {
          // The path or directory to your compiled project
          project: 'build/',
          // The domain or subdomain to deploy to
          domain: 'your-project-domain.surge.sh'
        }
      }
    }
  });

  // Load in the grunt-surge plugin
  grunt.loadNpmTasks('grunt-surge'); 

  // Add a `grunt deploy` task that runs Surge
  grunt.registerTask('deploy', ['surge']);
};

To update this example in your own project, make the following changes:

  1. Change the project from build/ to whatever directory your project compiles to. This is usually something like _site/, app/, or www/.
  2. Change the domain to whatever you’d like your Surge subdomain to be. You can also use your own custom domain.

Deploying your project

Now that your project is configured, you can run the Grunt task:

grunt deploy

…this will run Surge with the configuration you specified. If you haven’t logged in or signed up before, you will be prompted to do so. Then, your project will be deployed to the domain or subdomain you specified.

Improving your deploy task

From here, you can continue to customize your Grunt deploy task. For example, if your default Grunt task runs all the other plugins you need to build your site, you can make grunt deploy run that task first:

grunt.registerTask('deploy', ['default', 'surge']);

Now, fast, static deployment is built right into your Gruntfile! If you haven’t already, a great next step is to add your own custom domain for free.