使用Grunt的初学者需要为我的Gruntfile.js提供一些建议

时间:2014-07-09 14:11:46

标签: javascript coffeescript gruntjs livereload

我刚刚建立自己的咕噜声,这就是我想出来的。我只是想知道是否有人可以查看并给我一些提示/建议。

module.exports = function (grunt) {
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        coffee: {
            compile: {
                expand: true,
                flatten: true,
                cwd: 'src/coffee',
                src: ['*.coffee'],
                dest: 'src/js/',
                ext: '.js'
            }
        },
        concat: {
            css: {
                src: [
                    'src/css/*'
                ],
                dest: 'css/.css'
            },
            js: {
                src: [
                    'src/js/*'
                ],
                dest: 'js/package.js'
            }
        },
        cssmin: {
            css: {
                src: 'css/package.css',
                dest: 'css/package.min.css'
            }
        },
        uglify: {
            js: {
                files: {
                    'js/package.min.js': ['js/package.js']
                }
            }
        },
        watch: {
            aspx: {
                files: ['*.aspx', '*.master']
            },
            css: {
                files: ['src/css/*'],
                tasks: ['concat:css', 'cssmin']
            },
            coffee: {
                files: ['src/coffee/*'],
                tasks: ['coffee:compile']
            },
            js: {
                files: ['src/js/*'],
                tasks: ['concat:js', 'uglify']
            },
            livereload: {
                files: ['*.aspx', '*.master', 'css/*.css', 'js/*.js'],
                options: { nospawn: true, livereload: true }
            }
       }
    });
    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-coffee');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    grunt.registerTask('default', ['coffee:compile','concat:css', 'cssmin:css', 'concat:js', 'uglify:js', 'watch']);
};

它确实有效,并且可以完美地重新加载和编译。我只是想知道是否有更有效的方法来处理这个问题。作为我的第一个gruntfile,我知道它远非完美。

1 个答案:

答案 0 :(得分:0)

我建议load-grunt-tasks以减少主Gruntfile.js的复杂性。它的使用非常简单。它允许您将Gruntfile.js拆分为存储在单独的Grunt文件夹中的许多较小的JS文件,例如:

/root
  /Grunt
    cssmin.js
    coffee.js
    watch.js
    ...

然后你的主要Gruntfile.js加载你的任务很简单,例如:

module.exports = function (grunt) {
  require('load-grunt-tasks')(grunt);
}

它们与名为aliases.yaml的YAML文件一起保存,该文件位于Grunt文件夹中,详细说明了Grunt命令及其相关进程。所以在YAML文件中有这个:

lint:
  - clear
  - jshint
  - jscs

您可以运行grunt lint并运行这些任务。

我发现它是一个完整的救星,并且b)帮助我在不同程度上理解Grunt。

I've made an example repo for you to help explain what I'm talking about。我希望能提供一些帮助。