Поиск…


замечания

Gulp - это система сборки JavaScript, работающая на узле.js, как Grunt. Он позволяет автоматизировать общие задачи в процессе разработки. Gulp использует потоки -concept и code-over-configuration для более простого и интуитивно понятного процесса сборки. Концепция сквозной конфигурации позволяет создавать более читаемые и простые задачи, в то время как задачи сильно перенастраиваются.

Версии

Версия Дата выхода
3,4 2014-01-17
3,7 2014-06-01
3,8 2014-06-10
3,9 2015-06-02
3.9.1 2016-02-09
4.0.0 2016-06-21

Установка или настройка

1. Установите Node.js и NPM:

Для Gulp требуются Node.js и NPM, менеджер пакетов Node. Большинство инсталляторов включают NPM с Node.js. Обратитесь к документации по установке или подтвердите, что она уже установлена, выполнив следующую команду в вашем терминале,

npm -v
// will return NPM version or error saying command not found

2. Установите глоток во всем мире:

Если вы ранее устанавливали версию глотки во всем мире, запустите npm rm --global gulp чтобы убедиться, что ваша старая версия не сталкивается с gulp-cli .

$ npm install --global gulp-cli

3. Инициализируйте каталог проекта:

$ npm init

4. Установите gulp в свой проект devDependencies:

$ npm install --save-dev gulp

5. Создайте gulpfile.js в корне вашего проекта:

var gulp = require('gulp');

gulp.task('default', function() {
  // place code for your default task here
});

6. Запустите глоток:

$ gulp

Запуск по умолчанию будет выполняться и ничего не делать.

Для запуска отдельных задач используйте gulp <task> <othertask> .

Зависимость задачи

Вы можете запускать задачи последовательно, передавая второй параметр gulp.task() .

Эти параметры представляют собой набор задач, которые должны выполняться и выполняться до запуска вашей задачи:

var gulp = require('gulp');

gulp.task('one', function() {
   // compile sass css
});

gulp.task('two', function() {
   // compile coffeescript
});

// task three will execute only after tasks one and two have been completed
// note that task one and two run in parallel and order is not guaranteed
gulp.task('three', ['one', 'two'], function() {
   // concat css and js
});

// task four will execute only after task three is completed
gulp.task('four', ['three'], function() {
   // save bundle to dist folder
});

Вы также можете опустить эту функцию, если хотите только запустить набор задач зависимостей:

gulp.task('build', ['array', 'of', 'task', 'names']);

Примечание . Задачи будут выполняться параллельно (все сразу), поэтому не допускайте, чтобы задачи запускались / заканчивались по порядку. Запуск gulp.series() v4 , gulp.series() следует использовать, если порядок выполнения задач зависимостей важен.

Файл Concat js в подпапке с помощью gulp

var gulp = require('gulp'); 

// include plug-ins
var uglify = require('gulp-uglify'),
    concat = require('gulp-concat');

// Minified file
gulp.task('packjsMin', function() {
   return gulp.src('node_modules/angular/*.js')
      .pipe(concat('script.js'))
      .pipe(uglify())
      .pipe(gulp.dest('Scripts'));
});

//Not minified file
gulp.task('packjs', function () {
    return gulp.src('node_modules/angular/*.js')
      .pipe(concat('allPackages.js'))
      .pipe(gulp.dest('Scripts'));
});

gulp CLI docs

Флаги

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

  • -v или --version отображает глобальные и локальные версии глотки
  • --require <module path> потребуется модуль перед запуском gulpfile. Это полезно для транспилеров, но также имеет другие приложения. Вы можете использовать несколько флагов --require
  • --gulpfile <gulpfile path> будет вручную задан путь к gulpfile. Полезно, если у вас есть несколько gulpfiles. Это также установит CWD в каталог gulpfile
  • --cwd <dir path> будет вручную установить CWD. Поиск gulpfile, а также относительности всех требует отсюда
  • -T или --tasks отобразит дерево зависимостей задачи для загруженного gulpfile
  • --tasks-simple отобразит список задач для загруженного gulpfile
  • --color заставит плагины gulp и gulp отображать цвета, даже если цветовая поддержка не обнаружена
  • --no-color заставит плагины глотков и глотков не отображать цвета даже при обнаружении поддержки цвета
  • --silent отключит все протоколы --silent

CLI добавляет process.env.INIT_CWD, который является оригинальным cwd, с которого он был запущен.

Специальные флаги задач

Обратитесь к этой статье StackOverflow о том, как добавить определенные пользователем флаги

Задачи

Задания можно выполнить, выполнив gulp <task> <othertask> . Просто запуск gulp выполнит задание, которое вы зарегистрировали, по default . Если нет заданий по default gulp будет ошибкой.

Составители

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



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