Поиск…


замечания

Дальнейшее чтение:

Руководство по установке Grunt содержит подробную информацию об установке конкретных, производственных или разрабатываемых версий Grunt и grunt-cli.

Руководство по настройке задач содержит подробное объяснение того, как настраивать задачи, цели, параметры и файлы внутри файла Grunt, а также объяснять шаблоны, шаблоны глобусов и импортировать внешние данные.

В руководстве « Создание задач» перечислены различия между типами задач Grunt и показаны некоторые примеры задач и конфигураций.

Введение в GruntJs

Grunt - это бегун для задач JavaScript, используемый для автоматизации повторяющихся задач, таких как минификация, компиляция, модульное тестирование, листинг и т. Д.

Чтобы начать работу, вы захотите установить интерфейс командной строки Grunt (CLI) по всему миру.

npm install -g grunt-cli

Подготовка нового проекта Grunt: типичная настройка включает в себя добавление двух файлов в ваш проект: package.json и Gruntfile.

package.json: Этот файл используется npm для хранения метаданных для проектов, опубликованных как модули npm. Вы перечислите grunt и плагины Grunt, необходимые вашему проекту как devDependencies в этом файле.

Gruntfile: этот файл называется Gruntfile.js и используется для настройки или определения задач и загрузки плагинов Grunt.

Example package.json:

{
  "name": "my-project-name",
  "version": "0.1.0",
  "devDependencies": {
    "grunt": "~0.4.5",
    "grunt-contrib-jshint": "~0.10.0",
    "grunt-contrib-nodeunit": "~0.4.1",
    "grunt-contrib-uglify": "~0.5.0"
  }
}

Пример файла grunt:

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
      },
      build: {
        src: 'src/<%= pkg.name %>.js',
        dest: 'build/<%= pkg.name %>.min.js'
      }
    }
  });

  // Load the plugin that provides the "uglify" task.
  grunt.loadNpmTasks('grunt-contrib-uglify');

  // Default task(s).
  grunt.registerTask('default', ['uglify']);

};

Установка gruntplugins

Добавление зависимостей

Чтобы использовать gruntplugin, вам сначала нужно добавить его в качестве зависимости от вашего проекта. Давайте используем плагин jshint в качестве примера.

npm install grunt-contrib-jshint --save-dev

Опция --save-dev используется для добавления плагина в package.json , таким образом, плагин всегда устанавливается после npm install .

Загрузка плагина

Вы можете загрузить свой плагин в файле loadNpmTasks с помощью loadNpmTasks .

grunt.loadNpmTasks('grunt-contrib-jshint');

Настройка задачи

Вы настраиваете задачу в файле grunt, добавляя свойство jshint к объекту, переданному в grunt.initConfig .

grunt.initConfig({
  jshint: {
    all: ['Gruntfile.js', 'lib/**/*.js', 'test/**/*.js']
  }
});

Не забывайте, что вы можете использовать другие свойства для других плагинов, которые вы используете.

Выполнение задачи

Чтобы просто запустить задачу с помощью плагина, вы можете использовать командную строку.

grunt jshint

Или вы можете добавить jshint в другую задачу.

grunt.registerTask('default', ['jshint']);

Задача по умолчанию выполняется с помощью команды grunt в терминале без каких-либо параметров.



Modified text is an extract of the original Stack Overflow Documentation
Лицензировано согласно CC BY-SA 3.0
Не связан с Stack Overflow