关于grunt

什么是grunt？

• 一种自动化任务处理工具；
• 一个工具框架，有很多插件扩展它的功能；
• 基于 Node.js ，用 JS 开发，这样就可以借助 Node.js 实现跨系统跨平台的桌面端的操作，例如文件操作等等。此外，Grunt 以及它的插件们，都作为一个 包 ，可以用 NPM 安装进行管理。
• NPM 生成的 package.json 项目文件，里面可以记录当前项目中用到的 Grunt 插件，而 Grunt 会调用 Gruntfile.js 这个文件，解析里面的任务（task）并执行相应操作。

安装 github
全局的脚手架工具：grunt-cli；即命令行；

npm install -g grunt-cli

生成package.json文件，许多需要使用nodejs安装的命令都需要先生成这个文件

进入我们新建的项目文件夹下，

cd grunt

做初始化

npm init
看不懂的可以直接回车，一般这里都是项目名项目描述作者等信息，
填完信息以后，就会自动生成这个文件；

接下来就是安装所需的插件：
通过插件可以实现一些我们想要的功能，如：
检查每个js文件语法、合并两个js文件、将合并后的js文件压缩、实现sass文件自动编译、新建一个本地服务器监听文件变动自动刷新HTML文件等

需要用到的插件名：
合并文件：grunt-contrib-concat
语法检查：grunt-contrib-jshint
Sass 编译：grunt-contrib-sass
压缩文件：grunt-contrib-uglify
监听文件变动：grunt-contrib-watch
建立本地服务器：grunt-contrib-connect

安装grunt和这些插件

npm install grunt --save-dev

表示通过 npm 安装了 grunt 到当前项目，同时加上了 –save-dev 参数，表示会**把刚安装的东西添加到 package.json文件中

npm install  grunt-contrib-concat
需要什么就写相对应的。

接下来就需要配置Gruntfile.js

顾名思义，这是一个js文件，里面可以写任意的js 代码；

使用如下：
module.exports = function(grunt) {

    除了自己所需要的模块，关于grunt的有关的主要三块代码

    任务配置代码：调用插件配置一下要执行的任务和实现的功能
    grunt.initConfig({
        pkg:grunt.file.readJSON('package.json'),
        `这句话表示读取package.json文件，并把里面的信息获取出来，方便在后面的任务中应用`
        uglify:{//这个名字是固定的，表示下面调用的uglify插件
            options:{//首先是配置了全局的options
                banner:'!<%=pkg.name %><%=grunt.template.today() %>'
            },
            build:{//然后新建一个build任务
                src:'src/<%=pkg.name %>.js',//把这个js 文件压缩，
                dest:'build/<%=pkg.name%>.min.js'//压缩后的文件在这输出
            }
        }
    })
    插件加载代码：把需要用到的插件加载进来
    当上面的uglify插件安装到项目之后，写下这段代码
    grunt.loadNpmTask('grunt-contrib-uglify')

    任务注册代码：注册一个 task，里面包含刚在前面编写的任务配置代码
    在上面的代码中已经加载了，并且有了任务，接下来就是注册任务
    grunt.registerTask('default',['uglify']);
    这段代码表示在default上面注册了一个uglify任务，


}