Grunt是一个JavaScript任务运行器,常用于压缩JavaScript文件,这样在应用时可以更快的加载,提高访问速度。文章主要是介绍在Windows下利用Grunt压缩 js文件。
1.安装
首先要安装NodeJS,package.json: 此文件被npm用于存储项目的元数据,以便将此项目发布为npm模块。你可以在此文件中列出项目依赖的grunt和Grunt插件,放置于devDependencies配置段内。
Gruntfile: 此文件被命名为 Gruntfile.js 或 Gruntfile.coffee,用来配置或定义任务(task)并加载Grunt插件的。 此文档中提到的 Gruntfile 其实说的是一个文件,文件名是 Gruntfile.js 或 Gruntfile.coffee。装。我们利用NodeJS内置的npm工具来安npm是 Node.js 的包管理器,npm是NodeJS的包管理器。命令:
npm install -g grunt-cli
传递-g标志可以让grunt命令运行于计算机的任意目录
2.在项目中添加两份文件:package.json 和 Gruntfile.js
package.json: 此文件被npm用于存储项目的元数据,以便将此项目发布为npm模块。你可以在此文件中列出项目依赖的grunt和Grunt插件,放置于devDependencies置段内。Gruntfile:用来配置或定义任务(task)并加载Grunt插件的。
文件添加的路径是:D:\web tools\grunt
1)npm init建立默认的package.json文件
可以看到文档目录和文件有变化
2)Gruntfile.js文件
先安装Uglify插件(压缩JavaScript代码),输入命令 npm install grunt-contrib-uglify --save-dev;
现在可以使用Gruntfile来配置Grunt。在任意文本编辑器中载入Gruntfile.js文件,输入如下代码:
module.exports = function (grunt) {
// 项目配置
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
uglify: {
options: {
banner: '/*! <%= pkg.file %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
},
build: {
src: 'src/<%=pkg.file %>.js',
dest: 'dest/<%= pkg.file %>.min.js'
}
}
});
// 加载提供"uglify"任务的插件
grunt.loadNpmTasks('grunt-contrib-uglify');
// 默认任务
grunt.registerTask('default', ['uglify']);
}
3.创建需要压缩的文件
test.js文件的内容可以随意
4.最后运行grunt命令
可以到多了dest文件夹,且有个压缩后的test.min.js文件
当然Grunt工具还有很多其他的功能!