[Grunt] External Config

最新推荐文章于 2025-09-04 14:12:30 发布

weixin_30357231

最新推荐文章于 2025-09-04 14:12:30 发布

阅读量43

点赞数

CC 4.0 BY-SA版权

文章标签： json

原文链接：http://www.cnblogs.com/Answer1215/p/4100953.html

本文介绍如何使用Grunt工具结合grunt-contrib-watch和grunt-contrib-uglify插件，实现文件监视及代码压缩功能。通过不同版本的配置示例，展示如何利用模板和配置文件简化Gruntfile的编写。

Let's combine uglifying, watching, and config stuff into one Grunt file to make it more of a standard Grunt file.

Install:

npm install grunt
npm install grunt-contrib-watch
npm install grunt-contrib-uglify

Example:

/**
 * Created by Answer1215 on 11/15/2014.
 */
module.exports = function(grunt){

    // Version one
    //grunt.initConfig({
    //
    //    uglify:{
    //        dist:{
    //            files:{
    //               "dist/app.min.js": "app/**/*.js"
    //            }
    //        }
    //    },
    //    watch:{
    //        files:"app/**/*.js",
    //        tasks: 'uglify'
    //   }
    //});

    //version two: using template
    //grunt.initConfig({
    //    conf: {
    //        input: "app/**/*.js"
    //    },
    //    uglify:{
    //        dist:{
    //            files:{
    //                "dist/app.min.js": "<%= conf.input %>"
    //            }
    //        }
    //    },
    //    watch:{
    //        files: "<%= conf.input %>",
    //        tasks: 'uglify'
    //   }
    //});


    //version three:  using config json file

    grunt.initConfig({
        conf: grunt.file.readJSON('config.json'),
        uglify: {
            dist:{
                files:{
                    "dist/app.min.js": "<%= conf.input %>"
                }
            }
        },
        watch: {
            files: "<%= conf.input %>",
            tasks: ['uglify']
        }
    });

    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-contrib-uglify');
}