Grunt - 配置任务
您可以在Gruntfile.js 文件中为 Grunt 定义特定于项目的配置数据。
Grunt配置
可以使用grunt.initConfig()方法在 Gruntfile 中初始化任务配置数据。在grunt.initConfig()函数中，从 package.json 文件中获取配置信息。配置将包含名为属性的任务和任何任意数据。
grunt.initConfig({
jshint: {
// configuration for jshint task
},
cssmin: {
// configuration for cssmin task
},
// Arbitrary non-task-specific properties
my_files: ['dir1/*.js', 'dir2/*.js'],
});
任务配置和目标
当您运行任务时，Grunt 会在任务命名的属性下查找配置。我们将定义具有多种配置和目标选项的任务，如下所示 -
grunt.initConfig({
jshint: {
myfile1: {
// configuration for "myfile1" target options
},
myfile2: {
// configuration for "myfile2" target options
},
},
cssmin: {
myfile3: {
// configuration for "myfile3" target options
},
},
});
这里，jshint任务有myfile1和myfile2目标，cssmin任务有myfile3目标。当您运行grunt jshint时，它将迭代任务和目标以处理指定目标的配置。
选项
在任务配置中定义选项属性，该属性将覆盖任务默认值。每个目标都包含覆盖任务级选项的选项属性。它将具有以下格式 -
grunt.initConfig({
jshint: {
options: {
// task-level options that overrides task defaults
},
myfile: {
options: {
// "myfile" target options overrides task defaults
},
},
myfile1: {
// there is no option, target will use task-level options
},
},
});
文件
Grunt 提供了一些用于指定任务应操作哪些文件的想法，并使用不同的方式来指定src-dest文件映射。以下是src和dest映射支持的一些附加属性-
filter - 它是一个指定匹配的src文件路径并返回 true 或 false 值的函数。
nonull - 当设置为 true 时，它定义非匹配模式。
点- 它匹配以句点或其他方式开头的文件名。
matchBase - 它将包含斜杠的模式与路径的基本名称相匹配。
Expand - 它处理 src-dest 文件映射。
紧凑格式
它指定每个目标的 src-dest 文件映射，可用于只读任务，并且仅需要src属性，不需要dest属性。
grunt.initConfig({
jshint: {
myfile1: {
src: ['src/file1.js','src/file2.js']
},
},
cssmin: {
myfile2: {
src: ['src/file3.js','src/file4.js'],
dest: 'dest/destfile.js',
},
},
});
文件对象格式
它指定每个目标的 src-dest 文件映射，其中属性名称为dest file，其值为src file。
grunt.initConfig({
jshint: {
myfile1: {
files: {
'dest/destfile.js':['src/file1.js','src/file2.js'],
'dest/destfile1.js':['src/file3.js','src/file4.js'],
},
},
myfile2: {
files: {
'dest/destfile2.js':['src/file22.js','src/file23.js'],
'dest/destfile21.js':['src/file24.js','src/file25.js'],
},
},
},
});
文件数组格式
它通过使用每个映射的附加属性来指定每个目标的 src-dest 文件映射。
grunt.initConfig({
jshint: {
myfile1: {
files: [
{src:['src/file1.js','src/file2.js'],dest:'dest/file3.js'},
{src:['src/file4.js','src/file4.js'],dest:'dest/file5.js'},
],
},
myfile2: {
files: [
{src:['src/file6.js','src/file7.js'],dest:'dest/file8/', nonull:true},
{src:['src/file9.js','src/file10.js'],dest:'dest/file11/', filter:'isFalse'},
],
},
},
});
旧格式
dest -as-target文件格式在多任务存在之前就已经存在，其中目标文件路径是目标的名称。以下格式已被弃用，并且不应在代码中使用。
grunt.initConfig({
jshint: {
'dest/destfile2.js':['src/file3.js','src/file4.js'],
'dest/destfile5.js':['src/file6.js','src/file7.js'],
},
});
自定义过滤功能
您可以使用过滤器属性来帮助获取目标文件的详细信息。以下格式仅在与实际文件匹配时才清除文件。
grunt.initConfig({
clean: {
myfile:{
src: ['temp/**/*'],
filter: 'isFile',
},
},
});
通配模式
通配符意味着扩展文件名。Grunt 通过使用内置的 node-glob和minimatch 库来支持通配。通配模式包括以下几点 -
- *匹配任意数量的字符，但不匹配/。
- ？匹配单个字符，但不匹配/。
- **匹配多个字符，包括/。
- {}指定逗号分隔的“或”表达式列表。
- ！将否定开头的模式匹配。
例如 -
{src: 'myfile/file1.js', dest: ...} // it specifies the single file
{src: 'myfile/*.js', dest: ...} //it matches all the files ending wth .js
{src: 'myfile/{file1,file2}*.js', dest: ...} //defines the single node glob pattern
{src: ['myfile/*.js', '!myfile/file1.js'], dest: ...} // all files will display in alpha
// order except for file1.js
动态构建文件对象
当您处理单个文件时，您可以使用其他属性来动态构建文件列表。当您将Expand属性设置为 true 时，它将启用以下一些属性 -
cwd将所有src匹配到该路径。
src匹配要匹配的模式，相对于cwd。
dest属性指定目标路径前缀。
ext将使用目标路径中生成的值替换现有扩展。
extDot表示表示扩展名的句点所在的位置。它使用第一个句点或最后一个句点；默认情况下，它设置为第一个周期
flatten会从目标路径中删除所有路径部分。
重命名指定包含新目标和文件名的字符串。
重命名属性
它是一个独特的 JavaScript 函数，它返回一个字符串，并且您不能使用字符串值进行重命名。在以下示例中，复制任务将创建 README.md 的备份。
grunt.initConfig({
copy: {
backup: {
files: [{
expand: true,
src: ['docs/README.md'], // creating a backup of README.md
rename: function () { // specifies the rename function
return 'docs/BACKUP.txt'; // returns a string with the complete destination
}
}]
}
}
});
模板
您可以使用<% %>分隔符指定模板。从配置中读取它们时，它们将自动扩展。它包括两种类型的属性 -
<%= prop.subprop %>属性用于扩展配置中prop.subprop的值，可以引用字符串值、数组和其他对象。
<% %>属性执行用于控制流或循环的内联 JavaScript 代码。
例如 -
grunt.initConfig({
concat: {
myfile: {
options: {
banner: '/* <%= val %> */\n',
},
src: ['<%= myval %>', 'file3/*.js'],
dest: 'build/<%= file3 %>.js',
},
},
// properties used in task configuration templates
file1: 'c',
file2: 'b<%= file1 %>d',
file3: 'a<%= file2 %>e',
myval: ['file1/*.js', 'file2/*.js'],
});
导入外部数据
您可以从package.json 文件导入外部数据。grunt-contrib- uglify插件可用于缩小源文件，并使用元数据创建横幅评论。您可以使用grunt.file.readJSON和grunt.file.readYAML导入 JSON 和 YAML 数据。
例如 -
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
uglify: {
options: {
banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
},
dist: {
src: 'src/<%= pkg.name %>.js',
dest: 'dist/<%= pkg.name %>.min.js'
}
}
});