grunt学习笔记

环境描述

node=v0.10.25

npm=1.3.24

grunt-cli=0.1.13

安装nodejs:http://nodejs.org/

安装grunt和grunt-client:

  npm install grunt

  npm install -g grunt-cli

说明

grunt客户端与grunt是一对多的关系。也就是一个客户端下可以使用不同版本的grunt。而这个取决于Gruntfile中的配置。

安装插件

例如:

npm install grunt-contrib-uglify

运行

安装完插件后,运行grunt:

grunt

Grunt项目描述

Grunt项目由两个配置文件和依赖插件组成。

package.json:配置项目信息、Grunt版本信息和Grunt插件信息。参考规范

Gruntfile:定义Grunt任务、配置Grunt插件。

配置参考 

package.json:

{
    "name": "my-project-name", // 项目名称
    "version": "0.1.0", // 项目版本
    "devDependencies": { // 项目依赖
        "grunt": "~0.4.1", // Grunt库
        "grunt-contrib-jshint": "~0.6.0", //以下三个是Grunt内置任务
        "grunt-contrib-nodeunit": "~0.2.0",
        "grunt-contrib-uglify": "~0.2.2"
    }
}

gruntfile.js

module.exports = function(grunt){

    // 项目配置
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        uglify: {
            options: {
                banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */
'
            },
            build: {
                src: 'src/<%=pkg.name %>.js',
                dest: 'build/<%= pkg.name %>.min.js'
            }               
        }
    });

    // 加载提供"uglify"任务的插件
    grunt.loadNpmTasks('grunt-contrib-uglify');

    // 默认任务
    grunt.registerTask('default', ['uglify']);
}

参考:新手上路

------------------------------------------------------------------------------------------------------------------------------------------ 需要荷兰版牛栏、荷兰美素、母婴用品的攻城师、设计师朋友,欢迎关顾【七彩母婴店】【http://qicaoyun.taobao.com】。凡是从博客园得知信息的,全店商品,均可优惠,请告知客服哦。你也可以通过淘代码【D5867219】,在淘宝搜索到我们。收藏有礼哦!
原文地址:https://www.cnblogs.com/javawer/p/3559594.html