使用Grunt Serve在localhost上显示网站？

Question

我过去曾经制作过Gruntfiles，但主要是为了编译Less和Jade，所以这个步骤稍微偏离了我的舒适区域，我正在努力弄清楚要做什么。

我想使用Gruntfile：

1. 将Jade编译为html
2. 编译少到css
3. 在localhost:9000
构建并展示网站
4. 保存文件时刷新localhost:9000（我使用grunt watch假设？）

基本上，我想保持轻松和轻松，所以一旦我学会了我就可以用它来教别人我知道的。 ：）

到目前为止，这是我的Gruntfile的样子。我在那里有grunt-serve，但是当我运行它时没有任何东西加载到页面，所以我真的很困惑。谢谢你的帮助！

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');
};

Answer 1

我认为您的构建任务正在运行jade，而不是服务。而不是

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

试

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