干什么用?
基于Node.js的一款能够按照预先设定的顺序自动运行一系列任务的工具。简化工作流程,减轻重复性工作带来的负担。
如何使用?
1.安装
sudo npm install grunt-cli -g
2.命令脚本文件Gruntfile.js--用于配置或定义任务、加载 Grunt 插件
1)grunt.initConfig:配置Grunt各种模块的参数
2)grunt.loadNpmTasks:加载模块文件
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-concat');
对于加载多个模块的方法:安装load-grunt-tasks模块
require('load-grunt-tasks')(grunt)
替代所有tasks语句,自动分析package.json文件,在使用npm命令卸载模块以后,模块会自动从package.json文件中消失,这样就避免了必须手动从Gruntfile.js文件中清除的麻烦。
3)grunt.registerTasks :定义如何调用任务
不提供参数:grunt 依次执行任务
提供参数: grunt 模块名:目标名 只执行某个任务
grunt # 默认情况下,先压缩后合并
grunt cssmin:minify # 只压缩不合并
grunt css:combine # 只合并不压缩
常用的模块
grunt-contrib-clean 删除文件
https://www.npmjs.com/package/grunt-contrib-clean
grunt-contrib-compass 用compass编译sass
https://www.npmjs.com/package/grunt-contrib-compass
grunt-contrib-concat 合并文件
https://www.npmjs.com/package/grunt-contrib-concat
grunt-contrib-copy 复制文件
https://www.npmjs.com/package/grunt-contrib-copy
grunt-contrib-cssmin 压缩css
https://www.npmjs.com/package/grunt-contrib-cssmin
grunt-contrib-imagemin 图像压缩
https://www.npmjs.com/package/grunt-contrib-imagemin
grunt-contrib-jshint 检查js语法
https://www.npmjs.com/package/grunt-contrib-jshint
grunt-contrib-uglify 压缩合并js
https://www.npmjs.com/package/grunt-contrib-uglify
grunt-contrib-watch 监视文件变动做相应动作
https://www.npmjs.com/package/grunt-contrib-watch
grunt-contrib-connect 运行一个Web服务
https://www.npmjs.com/package/grunt-contrib-connect
grunt-contrib-sass sass转为css
grunt-autoprefixer css语句加浏览器前缀
grunt-htmlhint 检查HTML语法
grunt-contrib-stylus 编写styl输出css
https://www.npmjs.com/package/grunt-contrib-stylus
3.package.json--用于保存项目元数据
分享到:
相关推荐
Salesforce Grunt 自动化任务运行器。 此 Grunt 构建将编译您的 LESS 文件、连接所有 JavaScript 代码、包含图像并将其作为单一资源部署到 Salesforce 中。 只需一个命令! 、 和 。 ###指示 克隆 GitHub 存储...
为什么要使用任务运行器? 一言以蔽之,就是自动化。 当执行重复性任务(如缩小,编译,单元测试,整理等)时,您要做的工作越少,您的工作就越容易。 通过Gruntfile配置它之后,任务运行器可以以零的工作量为您和您...
【Brackets-Grunt:在Brackets中管理与运行Grunt任务】 Brackets-Grunt是一款专门为Adobe Brackets设计的扩展程序,它使得开发者能够直接在Brackets的环境中查看和执行Grunt任务,极大地提高了前端开发的工作效率。...
Grunt作为JavaScript任务运行器,通过简洁的配置文件和丰富的插件,让开发者能够轻松实现项目构建的自动化。无论是小规模的个人项目还是大型团队协作,Grunt都能够提供高效、灵活的解决方案。了解并掌握Grunt的使用...
接着,在你的项目根目录下创建一个`package.json`文件,这是Node.js项目的配置文件,通过运行: ```bash npm init ``` 然后根据提示填写项目信息。 安装Grunt及其插件,这里可能包括用于加密JavaScript的插件,...
Grunt是JavaScript的一个任务运行器,它是基于Node.js的。Grunt的主要功能是通过预设的任务来自动化常见的Web开发工作,如编译、压缩、测试、部署等。它通过编写JSON格式的配置文件(Gruntfile.js)来定义一系列的...
Grunt,全称为“Grunt.js”,是一个基于Node.js的任务运行器,它允许开发者通过编写配置文件(Gruntfile.js)来定义一系列自动化任务,从而实现项目的构建流程自动化。Grunt的核心理念是“配置优于代码”,这意味着...
`Grunt`是一个基于JavaScript的任务运行器,它允许开发者通过编写配置文件(Gruntfile.js)来定义一系列的任务,从而实现项目构建、测试、部署等自动化流程。`Grunt`拥有丰富的插件库,覆盖了前端开发的多个方面,...
5. **watch**:这是一个监控任务,当指定的文件发生改变时,Grunt会自动运行相关任务。例如,当新的JavaScript文件被编辑保存后,Grunt会自动执行jshint、concat和uglify任务,确保代码质量和性能。 **安装与使用**...
在IT行业中,Grunt是一个广泛使用的自动化工具,它允许开发者定义和执行各种构建任务,如编译、测试、打包和优化项目。`pipe-grunt`是针对Grunt的一个插件,其主要目的是解决在处理文件时的一个常见问题:文件位置的...
Grunt 是一个基于任务的JavaScript项目构建工具,它允许开发者通过编写配置文件来自动化一系列的前端开发任务。这个压缩包包含了在执行`npm install grunt --save-dev`命令后安装的所有Grunt相关模块,其中`node_...
Grunt是一个任务运行器,可以帮助开发者执行一系列预定义的任务,如编译、压缩、测试等,极大地提高了工作效率。在这个项目中,`mask`可能是某种特定的插件或者任务配置,用于处理前端资源,比如图片、CSS或...
Grunt,作为一个JavaScript任务运行器,就是解决这个问题的有效手段。本文将深入探讨如何使用Grunt来打包前端代码,以提高开发效率和代码质量。 Grunt的起源与简介: Grunt由jQuery团队的成员Tom Dye创建,它的主要...
它是一个任务运行器,可以自动化执行一系列常见的开发任务,如编译、压缩、测试、构建等,从而极大地提升了开发效率。 Grunt的核心概念是任务(Task)和配置文件(Gruntfile)。任务是你想要执行的一系列操作,而...
Grunt 是一个基于Node.js的任务运行器,它允许开发者通过编写配置文件来定义一系列的自动化任务,如编译Less或Sass到CSS,合并JavaScript文件,压缩图片,甚至进行单元测试等。Grunt社区提供了大量的插件,这些插件...
如果启用了`watch`任务,当源文件发生变化时,Grunt会自动重新执行这些任务。 ### 总结 这个"Grunt入门练习Demo"旨在演示如何使用Grunt进行文件合并和压缩,以及实时监听和自动构建。通过学习和实践这个Demo,你...
Grunt是JavaScript世界中的一款任务自动化工具,它允许开发者通过配置文件定义一系列的任务,实现代码的编译、压缩、测试、部署等自动化工作流程。Grunt依赖于Node.js环境,因此在使用Grunt之前,我们需要先安装Node...
此时,自动化构建工具应运而生,其中Grunt作为一款非常受欢迎的任务运行器,能够帮助开发者实现自动化任务,提高开发效率。本书《Automate with Grunt》深入浅出地介绍了如何利用Grunt来优化前端工作流程,不仅适合...