grunt构建工具使用总结(二)Gruntfile文件配置
来源:互联网 发布:java 网页爬虫框架 编辑:程序博客网 时间:2024/06/05 04:38
启动grunt必须新建一个Gruntfile文件,在文件中必须写的代码:
module.exports = function (grunt) {}
注:所有的grunt配置代码都放在module.exports这个函数中。
本节主要谈谈一下几点设置:concat(合并),uglify(压缩),watch(监视),jshint(代码规范)
1.代码合并压缩插件(concat,uglify)
在现在的前端项目中代码合并压缩是项目必须要做的,可以加快页面加载速度,也可以缩小项目的体积。
首先需要安装concat,uglify插件:
npm install grunt-contrib-concat
npm install grunt-contrib-uglify
配置concat任务(将a.js,b.js,c.js合并成all.js):
//数组写法
concat:{
build:{
src:["a.js","b.js","c.js"],
dest:"all.js"
}}
//对象写法
concat: {
build2: {
files: {
'all.js': ["a.js","b.js","c.js"]
}}}
//同时创建多个合并任务
concat:{
build:{
src:["a.js","b.js","c.js"]
dest:"all.js"
}
build2:{
files:{
"all.js":["a.js","b.js","c.js"]
}
}
}
uglify的配置同concat相同。
2.项目中各个文件的watch
安装插件:npm install grunt-contrib-watch
配置任务:
watch:{
scripts: {
files: ["a.js","b.js","c.js"],
tasks: ['concat'],//当files中文件发生改变时,需要执行的任务
}
}
3.文件的jslint
jshint: {
build: ["a.js","b.js","c.js" ],
}
grunt.loadNpmTasks('grunt-contrib-jshint');//加载任务插件
grunt.registerTask('default', 'jshint’);//执行所定义的任务可以传入数组或函数
- grunt构建工具使用总结(二)Gruntfile文件配置
- grunt构建工具使用总结(一)环境搭建
- grunt入门讲解3:实例讲解使用 Gruntfile 配置任务
- grunt入门讲解3:实例讲解使用 Gruntfile 配置任务
- Grunt Gruntfile.js文件详解
- 使用grunt-init自动创建gruntfile.js和package.json文件
- Grunt学习笔记之Gruntfile中任务的配置
- Grunt Gruntfile.js uglify concat watch 基本配置
- grunt gruntfile.js详解
- 自动构建工具Grunt
- grunt自动化构建工具
- grunt构建工具安装
- maven项目中整合grunt构建工具(二)-js合并、压缩技术
- 使用Grunt构建项目
- package.json, Gruntfile.js等文件配置
- Grunt 入门教程三:GruntFile 例子
- 前端自动化构建工具Grunt
- NodeJS项目构建工具Grunt
- Java实现SHA1摘要算法
- 算法加速思路
- 结构体内存对齐规则是什么?
- 关于Apache文件夹中httpd.conf的那点事(1)
- 高德地图路线规划
- grunt构建工具使用总结(二)Gruntfile文件配置
- 2018网易内推码(165S3J1)
- java api操作 hbase
- 深入浅出Tensorflow(三):训练神经网络模型的常用方法
- Banner轮播图
- C#的基础知识
- fis3创建项目
- 优秀计算机知识网址(持续更新中)
- C++中的继承问题