Grunt
来源:互联网 发布:阿里云系统自带root 编辑:程序博客网 时间:2024/04/30 09:23
Grunt
1 安装Grunt命令行工具包 grunt-cli
npm install -g grunt-cli
Grunt被分为好几个包,每个包用于特定的目的。grunt-cli包为我们提供了一个命令行界面。但我们还需要安装grunt才能使用该界面。安装grunt-cli时并没有为我们自动安装grunt。
需要在我们的项目中安装Grunt作为依赖。在一个项目中安装Grunt,可以通过以下步骤实现:
(1)创建一个项目文件夹
(2)在命令行中浏览到该文件夹,通过以下命令为项目创建一个package.json文件
npm init
(3) 通过以下命令安装Grunt
npm install grunt --save-dev
Grunt的运行需要一个名为Gruntfile.js的配置文件支持,在该文件中声明并配置了你想在当前项目中执行的所有任务。
Gruntfile.js文件框架示例:
module.exports = function(grunt) {}
它其实定义了一个Node.js的模块,在模块中接收一个grunt对象 。
在grunt上注册一个默认任务:
module.exports = function(grunt){grunt.registerTask('default', function(){console.log('Hello from Grunt.');});}
通过grunt.registerTask()方法可以创建一个新的Grunt任务,创建时可以传入一个任务名称以及一个回调函数。当触发该任务时就会执行相应的回调函数。
处理参数
module.exports = function(grunt){grunt.registerTask('greet', function(name){grunt.log.writeln('Hi there, ' + name);});}
执行非default命名任务
grunt greet
在执行任务时提供实际参数
grunt greet:winstar
传多个参数
grunt addNumbers:1:2
处理异常
grunt.warn('warning info.');
强制执行任务
grunt addNumbers:a:2 --force
阻止强制执行
grunt.fatal()
一次注册多个任务
grunt.registerTask('all', ['default', 'greet:Brain', 'addNumbers:2:3']);
registerTask()方法还可以接收第三个参数,在任务名称之后回调函数之前,可以添加对该任务的描述。
配置选项,Grunt提供了grunt.config.inig()方法用于配置Grunt任务。示例如下:
grunt.config.init({});
创建目录
Grunt内置的grunt.file.mkdir()方法可用以创建文档目录。 创建文档目录示例如下:
module.exports = function(grunt) {grunt.config.init({copyFiles: {options: {workingDirectory: 'working'}}});grunt.registerTask('createFolder', 'Create the working folder', function(){grunt.config.requires('copyFiles.options.workingDirectory');grunt.file.mkdir(grunt.config.get('copyFiles.options.workingDirectory'));});}
grunt createFolder
删除目录
使用grunt.file.delete()方法
module.exports = function(grunt) {grunt.config.init({copyFiles: {options: {workingDirectory: 'working'}}});grunt.registerTask('clean', 'Deletes the working folder and its contents', function(){grunt.config.requires('copyFiles.options.workingDirectory');grunt.file.delete(grunt.config.get('copyFiles.options.workingDirectory'));});}
复制文件
使用grunt.file.copy()方法
module.exports = function(grunt) {grunt.config.init({copyFiles: {options: {workingDirectory: 'working',manifest: ['index.html', 'stylesheets/style.css', 'javascripts/app.js']}}});grunt.registerTask('copyFiles', function(){var files, workingDirectory;grunt.config.requires('copyFiles.options.manifest');grunt.config.requires('copyFiles.options.workingDirectory');files = grunt.config.get('copyFiles.options.manifest');workingDirectory = grunt.config.get('copyFiles.options.workingDirectory');files.forEach(function(file){var destination = workingDirectory + '/' + file;grunt.log.writeln('Copying ' + file + ' to ' + destination);grunt.file.copy(file, destination);});});}
Grunt提供的其他方法
grunt.file.isDir() 判断是否为目录
grunt.file.recurse() 文件/目录递归
grunt.file.read() 读取指定文件内容
grunt.file.write() 将指定内容写到文件中
grunt.file.readJSON() 读取JSON数据
grunt.template.process() 创建一个模板字符串片段,该片段可以用于写进一个文档中
在注册任务时还可以通过this.options()方法获取Grunt的配置对象,如前面的files可以通过以下方式获得:
files = this.options().manifest;
在注册任务时还可以通过this.name方式获取任务名称。
- grunt
- grunt
- Grunt
- Grunt
- grunt
- grunt
- Grunt
- grunt
- Grunt
- grunt
- Grunt
- grunt
- grunt教程--初涉grunt
- grunt教程-安装grunt
- Grunt-Grunt使用
- 【Grunt】Grunt打包入门
- 【Grunt】Grunt打包流程
- grunt js
- PHP函数tempnam()
- 第七章 查找技术知识导图
- 各种回调:定时器schedule、普通回调callFunc、菜单回调menu_selector、事件回调event_selector
- 怪异的JavaScript
- 在ARM上运用opencv库时遇到的问题
- Grunt
- C语言入门经典
- 汇总(之一):交叉编译工具链arm-none-linux-gnueabi-, Qt交叉编译安装和移植,Qt桌面版编译安装,QTcreator安装和配置
- “APP_NAME" IS NOT TRANSLATED IN ZH, ZH_CN……..解决办法
- JQuery的AJAX调用——序列化
- 自定义一个cell的步骤大全
- POJ 题目2752 Seek the Name, Seek the Fame(KMP)
- CCCallFunC家族 定时触发器
- 一起学android之EditText的各种使用(15)