grunt 合并压缩任务

module.exports = function(grunt) {



    // LiveReload的默认端口号,你也可以改成你想要的端口号

    var lrPort = 35729;

    // 使用connect-livereload模块,生成一个与LiveReload脚本

    // <script src="http://127.0.0.1:35729/livereload.js?snipver=1" type="text/javascript"></script>

    var lrSnippet = require('connect-livereload')({

        port: lrPort

    });

    // 使用 middleware(中间件),就必须关闭 LiveReload 的浏览器插件

    var lrMiddleware = function(connect, options) {

        return [

            // 把脚本,注入到静态文件中

            lrSnippet,

            // 静态文件服务器的路径

            connect.static(options.base),

            // 启用目录浏览(相当于IIS中的目录浏览)

            connect.directory(options.base)

        ];

    };



    // 项目配置(任务配置)

    grunt.initConfig({

        // 读取我们的项目配置并存储到pkg属性中

        pkg: grunt.file.readJSON('package.json'),

        // 通过connect任务,创建一个静态服务器

        connect: {

            options: {

                // 服务器端口号

                port: 8000,

                // 服务器地址(可以使用主机名localhost,也能使用IP)

                hostname: 'localhost',

                // 物理路径(默认为. 即根目录) 注:使用'.'或'..'为路径的时,可能会返回403 Forbidden. 此时将该值改为相对路径 如:/grunt/reloard。

                base: '.'

            },

            livereload: {

                options: {

                    // 通过LiveReload脚本,让页面重新加载。

                    middleware: lrMiddleware

                }

            }

        },

        // 通过watch任务,来监听文件是否有更改

        watch: {

            client: {

                // 我们不需要配置额外的任务,watch任务已经内建LiveReload浏览器刷新的代码片段。

                options: {

                    livereload: lrPort

                },

                // '**' 表示包含所有的子目录

                // '*' 表示包含所有的文件

                files: ['html/*.html', 'css/*.css', 'js/*.js', 'images/**/*']

            },

        },

        concat: {           //合并任务

            js: {       //合并任务名字--合并js

                files: {   //合并文件对应关系 'dist/js/test.js': ['js/*.js'],

                }

            },

            css: {        //合并任务名字--合并css

                files: {

                    'dist/css/test.css': ['css/*.css']

                }

            }

        },

        cssmin: {

            //文件头部输出信息

            options: {

                banner: '/*creat: <%= new Date() %> */',

           compatibility : 'ie8', //设置兼容模式
                  noAdvanced : true //取消高级特性

//美化代码

                beautify: {

                    //中文ascii化,非常有用!防止中文乱码的神配置

                    ascii_only: true

                }

            },

            my_target: {

                files: [    //文件数组格式,同时允许每个映射拥有附加属性
{
'dist/css/common.min.css': ['css/common.css']},
{
'dist/css/index.min.css': ['css/index.css'],filter:'isfile'}
] }, my_target: { files: { //文件对象格式
'dist/css/common.min.css': ['css/common.css'],
'dist/css/commin.min.css':['css/common.css']
}

} } });
// grunt.initConfig配置完毕 // 监控html js css grunt.loadNpmTasks('grunt-contrib-connect'); grunt.loadNpmTasks('grunt-contrib-watch'); grunt.registerTask('live', ['connect', 'watch']); grunt.loadNpmTasks('grunt-contrib-concat'); //合并任务 grunt.loadNpmTasks('grunt-contrib-cssmin'); };

 

你可能感兴趣的:(grunt)