среда, 24 апреля 2013 г.

Команды Grunt

Типичный состав файла 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']));
});   

Комментариев нет:

Отправить комментарий