博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
使用grunt0.4进行js代码混淆
阅读量:5887 次
发布时间:2019-06-19

本文共 3805 字,大约阅读时间需要 12 分钟。

1.grunt是基于node,node需要>=0.8.0的稳定版本(奇数是开发版,偶数是稳定版)

2.安装grunt脚手架 (mac电脑需要权限  在前面加上 sudo)

npm install -g grunt-cli 

   验证grunt-cli是否安装成功

  

  这样的情况表示安装成功了!

3.在根目录下创建Gruntfile.js 文件,文件内容如下

module.exports = function(grunt) {        grunt.initConfig({            pkg: grunt.file.readJSON('package.json'),            concat: {                options: {                    separator: ';'                },                dist: {                    src: ['src/**/*.js'],                    dest: 'dist/<%= pkg.name %>.js'                }            },            uglify: {                options: {                    banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n'                },                buildall: {                    options: {                        mangle: true,                        compress: {                            drop_console: true                        },                        report: "min" //输出压缩率,可选值有false(不输出)                    },                    files: [{                        expand: true,                        cwd: 'src', //js目录下                        src: '**/*.js', //所有js文件                        ext: '.min.js', //压缩后的文件后缀名称                        dest: 'dist' //输出到此目录下                    }]                }                //    dist: {                //      files: {                //        'dist/<%= pkg.name %>.min.js': ['<%= concat.dist.dest %>']                //      }                //    }            },            qunit: {                files: ['test/**/*.html']            },            jshint: {                files: ['Gruntfile.js', 'src/**/*.js', 'test/**/*.js'],                options: {                    //这里是覆盖JSHint默认配置的选项                    globals: {                        jQuery: true,                        console: true,                        module: true,                        document: true                    }                }            },            watch: {                // files: ['<%= jshint.files %>'],                // tasks: ['jshint', 'qunit']                scripts: {                    files: ['src/**/*.js'],                    tasks: ['minall'],                    options: {                        spawn: true,                        interrupt: true                    }                }            }        });        grunt.loadNpmTasks('grunt-contrib-uglify');        // grunt.loadNpmTasks('grunt-contrib-jshint');        // grunt.loadNpmTasks('grunt-contrib-qunit');        // grunt.loadNpmTasks('grunt-contrib-watch');        // grunt.loadNpmTasks('grunt-contrib-concat');        grunt.registerTask('minall', ['uglify:buildall']);        grunt.registerTask('default', ['jshint', 'qunit', 'uglify', 'concat']);    };

4.安装依赖

  通过npm init创建package.json文件(有了就忽略),并写入json文件(按照顺序安装)

  npm install grunt --save-dev

  npm install grunt-contrib-uglify --save-dev

  npm install grunt-contrib-qunit --save-dev

  npm install grunt-contrib-concat --save-dev

  npm install grunt-contrib-jshint --save-dev

  npm install grunt-contrib-watch --save-dev

5.运行grunt uglify

-------------------------假装是个分割线----------------

我以为到这里就是已经结束了,然而 并不是,uglify默认的配置貌似不支持ES7的async语法,

所以吧。。。又用了bebel转了一次,感觉很麻烦,

1.安装babel-cli 

npm install --save-dev babel-cli

  

2.presets 字段设定转码规则 

npm install babel-preset-env --save-dev
npm install --save-dev babel-plugin-transform-runtime //对于es7 async的支持,否则会报错ReferenceError: regeneratorRuntime is not defined".

3.创建.bebalrec文件

{  "presets": ["env"],  "plugins": [[   "transform-runtime", {     "helpers": false,     "polyfill": false,     "regenerator": true,     "moduleName": "babel-runtime"   } ]]
}

4.package.json 中添加

"scripts": {    "build": "babel src -d dist"      //src现在资源目录 。dist转换后的目录  },

 

5.npm run build  

 

转载于:https://www.cnblogs.com/xuyuanlong/p/8910110.html

你可能感兴趣的文章
MSSQL跨服务器数据库查询
查看>>
WeChat Official Account Admin Platform API Introduction
查看>>
C语言写单链表的创建、释放、追加(即总是在最后的位置增加节点)
查看>>
poj1635
查看>>
C# LINQ详解(一)
查看>>
视频直播点播nginx-rtmp开发手册中文版
查看>>
iphone 添加CFNetwork.framework时,报错 socket
查看>>
ruby学习总结04
查看>>
Binary Tree Paths
查看>>
RESTful 架构详解(转)
查看>>
Ueditor自定义ftp上传
查看>>
线程以及多线程
查看>>
PHP队列的实现
查看>>
单点登录加验证码例子
查看>>
[T-SQL]从变量与数据类型说起
查看>>
稀疏自动编码之反向传播算法(BP)
查看>>
二叉搜索树转换成双向链表
查看>>
会员数据化运营
查看>>
WebLogic和Tomcat的区别
查看>>
java类中 获取服务器的IP 端口
查看>>