Запуск npm-скриптов параллельно с использованием gulp

Быстрый ответ

Для того чтобы запустить несколько npm скриптов одновременно, можно использовать утилиты concurrently или npm-run-all. Обе устанавливаются как разработческие зависимости в файле package.json.

Concurrently:

"scripts": {
  "parallel": "concurrently 'npm:script1' 'npm:script2'"
}

Запустить можно командой: npm run parallel.

npm-run-all:

"scripts": {
  "parallel": "npm-run-all -p script1 script2"
}

Скрипты начнут выполняться после вызова команды: npm run parallel.

concurrently – прекрасный выбор для работы с терминалом

При использовании concurrently нельзя не упомянуть опцию --kill-others. Она автоматически останавливает все скрипты при возникновении ошибки в одном из них, предотвращая образование зомби-процессов:

"scripts": {
  "parallel": "concurrently --kill-others 'npm:script1' 'npm:script2'"
}

npm-run-all – инструмент для работы на любых платформах

Если вам важно поддерживать совместимость на различных платформах, выберите npm-run-all. Данная утилита предлагает удобную команду run-p для запуска скриптов в параллельном режиме:

"scripts": {
  "parallel": "npm-run-all -p script1 script2"
}

Существует также флаг -r, который останавливает все скрипты при выполнении одного из них:

"scripts": {
  "serial-kill": "npm-run-all -r script1 script2"
}

Визуализация

Представим, что ваши npm скрипты – это космические корабли, готовые к запуску:

🚀 Скрипт A       🚀 Скрипт B       🚀 Скрипт C

Чтобы запустить их одновременно, нужно нажать все кнопки старта одновременно:

npm run script-a & npm run script-b & npm run script-c

Или можем использовать возможности npm-run-all:

🔛 npm-run-all --parallel script-a script-b script-c

Таким образом, гарантирован синхронный и эффективный старт!

Интеграция gulp с concurrently или npm-run-all

Если вы используете gulp в качестве инструмента сборки, его можно сочетать с concurrently или npm-run-all для более эффективного управления процессами:

const gulp = require('gulp');
const concurrently = require('concurrently');

gulp.task('serve', () => {
  concurrently([
    'gulp watch', // Внимательно следим за изменениями
    'gulp serve'  // Загружаем сервер
  ]);
});

Управление сложными скриптами и контроль процессов

Для работы со сложными скриптами или для надёжного управления процессами рассмотрите возможность использования PM2 – управляющего процессами Node.js. В less complex scenarios, структурируйте скрипты в составные npm команды, каждая из которых отвечает за определённую функцию.

Оптимизация package.json для лучшей поддержки и масштабирования

Если вы работаете над крупным проектом с сложной структурой скриптов, организуйте файл package.json для удобства использования и повышения производительности:

"scripts": {
  "dev:ssr": "npm run build:watch & npm run serve:ssr",
  "build:watch": "gulp watch --gulpfile gulpfile-esm.mjs",
  "serve:ssr": "node dist/server",
  "test:watch": "npm-run-all -p watch:*",
  "watch:tests": "jest --watch",
  "watch:lint": "eslint --watch"
}

Полезные материалы

1. npm-run-all – npm – возможности npm-run-all для одновременного запуска скриптов.
2. GitHub – open-cli-tools/concurrently – обучение использованию concurrently для одновременного выполнения команд.
3. javascript – How can I run multiple npm scripts in parallel? – Stack Overflow – обсуждение на Stack Overflow о параллельном запуске скриптов.
4. cross-env – npm – изучите использование cross-env для установки переменных окружения в разных платформах.
5. PM2 – Quick Start – продвинутые решения управления скриптами и процессами с помощью PM2.
6. scripts | npm Docs – официальная документация npm по скриптам.
7. Child process | Node.js v21.6.1 Documentation – ознакомьтесь с API "Child Process" Node.js для выполнения команд в npm скриптах.