0

我有一个 css 构建任务，它合并了来自 bower 依赖项和我自己的 css 的资源。

构建任务是使用 git 源代码控制的项目的一部分。该项目已经正常运行了一年多。

直到昨天，当我重新安装运行构建任务的 npm 依赖项时，一切都在我的 Windows 笔记本电脑上正常工作。

下面是一个简化的例子

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'))
});

包.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(...)声明的方式和位置可能存在问题。

我还尝试用 merge2 和 main-bower-files 分别替换 gulp-merge 和 gulp-main-bower-files 的已安装模块。使用其中一个或两个都解决了问题，但这不是一个理想的解决方法，因为它意味着更新 gulp 任务和安装的模块。

在我的项目中，突然无法输出任务合并 css（或 js）对于项目中的任何历史提交或分支都有实际问题。

有没有我可以诊断原始失败的$.merge(...)方法，或者我可以在我的 git 项目和任何分支的所有提交中用 merge2 追溯替换 gulp-merge 的方法？

4

0 回答 0