grunt使用入门

1、首先用npm在global环境安装grunt-cli ,注意在任何目录下 install -g都是同样的 npm install -g grunt-clihtml

2、安装grunt插件时项目中必定要package.json,因此在项目中加一个最简单的package.json。否则的话插件安装不上。前端

3、npm

在项目目录下安装grunt json

npm  instal grunt --save-devgrunt

4、插件

我在前端项目中常常须要concat和压缩,因此一下只掩饰这两个插件htm

npm install grunt-contrib-concat grunt-contrib-uglify --save-devblog

5、开发

把开发目录下的全部js,合并到dist目录保存为main.jsio

concat: {

        dist: {

            // the files to concatenate

            src: ['src/*.js'],

            // the location of the resulting JS file

            dest: 'dist/main.js'

        }

    }

 

把合并目录下的js,压缩

uglify: {

        dist: {

            files: {

                'dist/main.min.js': ['<%= concat.dist.dest %>']

            }

        }

    }

若是不用'<%= concat.dist.dest %>',而是直接写路径dist/main.js,那极可能在压缩时main.js尚未生成

 

所有代码以下图

6、运行grunt后结果以下

7、这个是dist文件夹下的内容

原文:http://jingyan.baidu.com/article/546ae185058da31149f28ce1.html

相关文章
相关标签/搜索