CODEWITHSUNDEEP
javascriptnode.jsgruntjsgrunt-contrib-watch
sugarPhlox
sugarPhlox

Reputation: 67

Using Grunt Serve to show website on localhost?

I've built Gruntfiles in the past, but mostly to compile Less and Jade, so this steps a bit out of my comfort zone and I'm struggling to figure out what to do.

I'd like to use the Gruntfile to:

  1. Compile Jade to html
  2. Compile Less to css
  3. Build and show website at localhost:9000
  4. Refresh localhost:9000 upon save of file (this uses grunt watch I'm assuming?)

Basically, I'd like to keep it light and easy, so that once I learn I can use it to teach others that I know. :)

Here's what my Gruntfile looks like so far. I have grunt-serve in there, but nothing loads to the page when I run it, so I'm really confused. Thanks for the help!

module.exports = function(grunt) {
  grunt.loadNpmTasks('grunt-contrib-jade');
  grunt.loadNpmTasks('grunt-contrib-less');
  grunt.loadNpmTasks('grunt-contrib-watch');

  grunt.initConfig({
    jade: {
      compile: {
        options: {
          client: false,
          pretty: true
        },
        files: [ {
          cwd: "assets/views",
          src: "**/*.jade",
          dest: "public",
          expand: true,
          ext: ".html"
        } ]
      }
    },    

    less: {
      development: {
        options: {
          compress: true,
          yuicompress: true,
          optimization: 2
        },
        files: {
          // target.css file: source.less file
          'public/css/main.css': 'assets/less/main.less',

        }
      }
    },

    watch: {
      styles: {
        files: [
          'less/main.less',
        ],
        tasks: ['less'],
        options: {
          nospawn: true
        }
      }
    },

    serve: {
      options: {
        port: 9000
      }
    }
  });

  grunt.registerTask('default', ['jade','less']);
  grunt.loadNpmTasks('grunt-serve');
};

Upvotes: 0

Views: 684

Answers (1)

James
James

Reputation: 11931

I think your build task is running jade and less, but not serve. Instead of

grunt.registerTask('default', ['jade','less']);

try

grunt.registerTask('default', ['jade','less','serve']);

Upvotes: 1

Related Questions