Типичный состав файла Gruntfile.js
module.exports = function(grunt) {
// Configuration goes here
grunt.initConfig({
// Configure the copy task to move files from the development to production folders
copy: {
target: {
files: {
'prod/': ['dev/**']
}
}
},
});
// Load plugins here
grunt.loadNpmTasks('grunt-contrib');
// Define your tasks here
grunt.registerTask('default', ['copy']);
};
Список доступных команд Grunt и установленных плагинов Grunt-contrib
grunt --help
Запуск тасков по дефолту
grunt
Запус какого-то отдельного таска, например jshint, вместе со всеми его таргетами
grunt jshint
Запуск отдельного таска с конкретным таргетом
grunt concat:foo
Определение своего собственного таска в файле Gruntfile.js
module.exports = function(grunt) {
// A very basic default task.
grunt.registerTask('default', 'Log some stuff.', function(){
grunt.log.write('Logging some stuff...').ok();
});
};
Формат работы с файлами
grunt.initConfig({
jshint: {
foo: {
src: ['src/aa.js', 'src/aaa.js']
},
},
concat: {
bar: {
src: ['src/bb.js', 'src/bbb.js'],
dest: 'dest/b.js',
},
},
});
Фильтрация файлов
grunt.initConfig({
clean: {
foo: {
src: ['tmp/**/*'],
filter: function(filepath) {
return (grunt.file.isDir(filepath) && require('fs').readdirSync(filepath).length === 0);
},
},
},
});
Импортирование данных в формате JSON и YAML
pkg: grunt.file.readJSON('package.json');
pkg: grunt.file.readYAML('');
---------------------------------------------------------------
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'
}
}
});
grunt.loadNpmTasks('grunt-uglify');
grunt.registerTask('default', ['uglify']);
Список плагинов Grunt
grunt-contrib-uglify
grunt-contrib-qunit
grunt-contrib-concat
grunt-contrib-jshint
grunt-contrib-watch
Установка всех плагинов
npm install grunt-contrib-uglify --save-dev
npm install grunt-contrib-qunit --save-dev
npm install grunt-contrib-concat --save-dev
npm install grunt-contrib-jshint --save-dev
npm install grunt-contrib-watch --save-dev
Загрузка всех плагинов в файле Gruntfile.js
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-qunit');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-concat');
Регистрация всех таксов, запускаемых по умолчанию
grunt.registerTask('default', ['jshint', 'qunit', 'concat', 'uglify']);
Запуск вотчера
grunt watch
Шаблоны как в Ruby on Rails
<%= pkg.name %> - вывод значения переменной
<% console.log('Здесь можно писать любой JavaScript-код'); %> - выполнение любого кода
Пример полного файла Gruntfile.js со всеми плагинами
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat: {
options: {
separator: ';'
},
dist: {
src: ['src/**/*.js'],
dest: 'dist/<%= pkg.name %>.js'
}
},
uglify: {
options: {
banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n'
},
dist: {
files: {
'dist/<%= pkg.name %>.min.js': ['<%= concat.dist.dest %>']
}
}
},
qunit: {
files: ['test/**/*.html']
},
jshint: {
files: ['gruntfile.js', 'src/**/*.js', 'test/**/*.js'],
options: {
// options here to override JSHint defaults
globals: {
jQuery: true,
console: true,
module: true,
document: true
}
}
},
watch: {
files: ['<%= jshint.files %>'],
tasks: ['jshint', 'qunit']
}
});
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-qunit');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.registerTask('test', ['jshint', 'qunit']);
grunt.registerTask('default', ['jshint', 'qunit', 'concat', 'uglify']);
};
Регистрация различных тасков
grunt.registerTask('default', ['jshint', 'qunit', 'concat', 'uglife']);
grunt.registerTask('dist', ['concat:dits', 'uglify:dist']);
Регистрация собственного таска
grunt.initConfig({
log: {
foo: [1, 2, 3],
bar: 'hello world',
baz: false
}
});
grunt.registerMultiTask('log', 'Log stuff.', function() {
grunt.log.writeln(this.target + ': ' + this.data);
});
grunt.registerTask('foo', 'A sample task that logs stuff.', function(arg1, arg2) {
if (arguments.length === 0) {
grunt.log.writeln(this.name + ", no args");
} else {
grunt.log.writeln(this.name + ", " + arg1 + " " + arg2);
}
});
Выполнение собственного таска
grunt log:foo
или с подстановкой аргументов 'testing' и '123'
grunt foo:testing:123
Внутри регистрации тасков можно запускать другие таски
grunt.registerTask('foo', 'My task.', function() {
grunt.task.run('bar', 'baz');
});
Таски могут быть асинхронными
grunt.registerTask('asyncfoo', 'My async task.', function() {
// Force task into async mode and grab a handle to the "done" function.
var done = this.async();
// Run some sync stuff.
grunt.log.writeln('Processing task...');
// And some async stuff.
setTimeout(function() {
grunt.log.writeln('All done!');
done();
}, 1000);
});
Таски имеют доступ к своему имени и аргументам, которые могут использоваться в коде
grunt.registerTask('foo', 'My task.', function(a, b) {
grunt.log.writeln(this.name, a, b);
});
В случае возникновения ошибки такс можно прервать программным способом
grunt.registerTask('foo', 'My task.', function() {
if (failureOfSomeKind) {
grunt.log.error('This is an error message.');
}
// Fail by returning false if this task had errors
if (ifErrors) { return false; }
grunt.log.writeln('This is the success message');
});
Если таск провалится, то все последующие таски будут прерваны, если при запуске не указана опиция --force
grunt --force
grunt.registerTask('foo', 'My "foo" task.', function() {
// Fail synchronously.
return false;
});
grunt.registerTask('bar', 'My "bar" task.', function() {
var done = this.async();
setTimeout(function() {
// Fail asynchronously.
done(false);
}, 1000);
});
Выполнение тасков может быть зависимым от результатов выполнения других тасков
grunt.registerTask('foo', 'My "foo" task.', function() {
return false;
});
grunt.registerTask('bar', 'My "bar" task.', function() {
// Fail task if "foo" task failed or never ran.
grunt.task.requires('foo');
// This code executes if the "foo" task ran successfully.
grunt.log.writeln('Hello, world.');
});
Таск может провалиться, если требуемая конфигурация grunt.config свойств не существует
grunt.registerTask('foo', 'My "foo" task.', function() {
// Fail task if "meta.name" config prop is missing.
grunt.config.requires('meta.name');
// Also fails if "meta.name" config prop is missing.
grunt.config.requires(['meta', 'name']);
// Log... conditionally.
grunt.log.writeln('This will only log if meta.name is defined in the config.');
});
Таск может получать доступ к содержимому grunt.config
grunt.registerTask('foo', 'My "foo" task.', function() {
// Log the property value. Returns null if the property is undefined.
grunt.log.writeln('The meta.name property is: ' + grunt.config('meta.name'));
// Also logs the property value. Returns null if the property is undefined.
grunt.log.writeln('The meta.name property is: ' + grunt.config(['meta', 'name']));
});
Комментариев нет:
Отправить комментарий