grunt自动化加密js

Grunt配置方法

前段时间终于搞定了grunt自动化加密js,整理了下流程,省的大家走弯路哈!整个包的下载地址:http://download.csdn.net/detail/lemon_zhao/9598890

1.从https://nodejs.org/en/下载node安装包 安装nodeJs环境

检查nodeJs是否安装成功,cmd下输入node -v检查当前node版本号

2.安装全局CLI
cmd输入 npm install -g grunt-cli
安装后的 grunt-cli路径C:\Users\lenovo\AppData\Roaming\npm\node_modules

3.在C:\lemon\lab创建两个文件 Gruntfile.js package.json,这两个是配置文件,从我上面给的链接可以下载得到,我得特别说明下

package.json,描述编译文件,js的版本号啦,作者啦,license啦都放这

{
    "name": "test",
    "version": "v1.4.4",
    "description": "jsEncrypt",
    "author": "lemon",
    "license": "MIT",
    "devDependencies": {
    "grunt": "~0.4.1",
    "grunt-contrib-jshint": "~0.6.3",
    "grunt-contrib-concat": "~0.3.0",
    "grunt-contrib-uglify": "~0.2.1",
    "grunt-contrib-requirejs": "~0.4.1",
    "grunt-contrib-copy": "~0.4.1",
    "grunt-contrib-clean": "~0.5.0",
    "grunt-strip": "~0.2.1"
    },
    "dependencies": {
        "express": "3.x"
    }
}

Gruntfile.js,编译代码,编译源代码路径,编译后代码路径,一些回调函数

module.exports = function (grunt) {
    // 构建任务配置
    grunt.initConfig({
        //读取package.json的内容,形成个json数据
        pkg: grunt.file.readJSON('package.json'),
        //压缩js
        uglify: {
            //文件头部输出信息
            options: {
                banner: '/* <%= pkg.name %> <%= pkg.description %> <%= pkg.version %> */\n',
                footer: '\n/* <%= grunt.template.today("yyyy-mm-dd") %> by lemon */',
                stripBanners: true
            },
            my_target: {
                files: [
                    {
                        expand: true,
                        //相对路径
                        cwd: 'jsSrc/',
                        src: '*.js',
                        dest: 'jsDist/',
                        rename: function (dest, src) {  
                        var folder = src.substring(0, src.lastIndexOf('/'));  
                        var filename = src.substring(src.lastIndexOf('/'), src.length);  
                        //  var filename=src;  
                        filename = filename.substring(0, filename.lastIndexOf('.'));  
                        var fileresult=dest + folder + filename + '.min.js';  
                        grunt.log.writeln("现处理文件:"+src+"  处理后文件:"+fileresult);  
                        return fileresult;  
                        //return  filename + '.min.js';  
                        }
                    }
                ]
            }
        },
        //压缩css
        cssmin: {
            //文件头部输出信息
            options: {
            banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n',
            //美化代码
            beautify: {
                //中文ascii化,非常有用!防止中文乱码的神配置
                ascii_only: true
                }
            },
            my_target: {
                files: [
                    {
                    expand: true,
                    //相对路径
                    cwd: 'cssSrc/',
                    src: '*.css',
                    dest: 'cssDist/',
                    rename: function (dest, src) {  
                    var folder = src.substring(0, src.lastIndexOf('/'));  
                    var filename = src.substring(src.lastIndexOf('/'), src.length);  
                    //  var filename=src;  
                    filename = filename.substring(0, filename.lastIndexOf('.'));  
                    var fileresult=dest + folder + filename + '.min.css';  
                    grunt.log.writeln("现处理文件:"+src+"  处理后文件:"+fileresult);  
                    return fileresult;  
                    //return  filename + '.min.js';
                        }
                    }
                ]
            }
        }
    });
    // 加载指定插件任务
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    // 默认执行的任务
    grunt.registerTask('default', ['uglify', 'cssmin']);
};

4.在这个目录下执行 npm install
5.有报错可能说:“ grunt-contrib-cssmin”notfound,需要安装css压缩插件
执行 npm install grunt-contrib-cssmin
6.有报错可能说: Fatal error :Unable to find local grunt或者找不到 grunt 的错误
重新安装 grunt
把 C:\Users\SOS\AppData\Roaming\npm\node_modules 下面的 grunt-cli 文件删除。。重新执行
npm install -g grunt-cli
7.在lab目录

在lab目录下执行grunt,编译成功!

猜你喜欢

转载自blog.csdn.net/lemon_zhao/article/details/52161988
今日推荐