gulp-merge не может вывести gulp-main-bower-files после.pipe

У меня есть задача сборки CSS, которая объединяет ресурсы из зависимостей bower и моего собственного css.

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

До вчерашнего дня все работало правильно на моем ноутбуке с Windows, когда я переустанавливал свои npm-зависимости, которые запускали задачу сборки.

Ниже приведен упрощенный пример

gulpfile.js

var gulp = require('gulp'),
  $ = require('gulp-load-plugins')();

gulp.task('default', function () {
  return $.merge (
    gulp.src('./bower.json')
      .pipe($.mainBowerFiles('**/*.css', {
        includeDev: 'exclusive',
        group: 'css'
      })
    ),
    gulp.src(['./source/css/styles.css'])
  )
  .pipe($.plumber())
  .pipe($.concat('stylesheet.css'))
  .pipe(gulp.dest('./build/css'))
});

package.json

{
  "name": "merge",
  "version": "1.0.0",
  "description": "",
  "main": "gulpfile.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "gulp": "^3.9.1",
    "gulp-concat": "^2.6.1",
    "gulp-load-plugins": "^1.5.0",
    "gulp-main-bower-files": "^1.6.2",
    "gulp-merge": "^0.1.1",
    "gulp-plumber": "^1.1.0",
  }
}

И bower.json

{
  "name": "merge",
  "description": "",
  "main": "gulpfile.js",
  "authors": [
    ""
  ],
  "license": "ISC",
  "homepage": "",
  "private": true,
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "devDependencies": {
    "normalize-css": "^7.0.0",
    "reset-css": "^2.2.1"
  },
  "group": {
    "css": [
      "reset-css",
      "normalize-css"
    ]
  }
}

До вчерашнего дня задача объединит оба источника, заявленные в $.merge(...), С вчерашнего дня npm install Я обнаружил, что слияние будет выводить результат только для первого объявленного источника.

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

var gulp = require('gulp'),
  $ = require('gulp-load-plugins')();

// the order of the sources has been reversed
gulp.task('default', function () {
  return $.merge (
    gulp.src(['./source/css/styles.css']),
    gulp.src('./bower.json')
      .pipe($.mainBowerFiles('**/*.css', {
        includeDev: 'exclusive',
        group: 'css'
      })
    )
  )
  .pipe($.plumber())
  .pipe($.concat('stylesheet.css'))
  .pipe(gulp.dest('./build/css'))
});

Проблема этого решения заключается в том, что выходной контент перевернут, что может вызвать проблемы с наследованием стилей и т. Д. Это изменение в успешном выводе заставляет меня думать, что может быть проблема с тем, как и где .pipe($.mainBowerFiles(...) объявлен

Я также попытался заменить установленные модули для gulp-merge и gulp-main-bower-files соответственно на merge2 и main-bower-files. Использование одного или обоих решений решило проблему, однако это не идеальный обходной путь, поскольку это означает обновление задачи gulp и установленных модулей.

Эта внезапная ошибка вывода задач слияния css (или js) в моем проекте имеет реальные проблемы для любого исторического коммита или ветки в проекте.

Могу ли я диагностировать неисправность оригинала? $.merge(...)или способ, которым я могу задним числом заменить gulp-merge на merge2 для всех коммитов моего проекта git и любых веток?

0 ответов

Другие вопросы по тегам