0

我写了一个不错的小构建脚本，它运行一些非常标准的任务，比如......

  • deploy/最初清理我的目录
  • 构建、连接、丑化和将文件从其dev/目录复制到关联deploy/目录
  • 关注变化
  • 等等

但是为了更好的上下文，我将其包括在下面：

var gulp              = require('gulp');
var changed           = require('gulp-changed');
var newer             = require('gulp-newer');
var sass              = require('gulp-sass');
var autoprefixer      = require('gulp-autoprefixer');
var cssmin            = require('gulp-minify-css');
var sourcemaps        = require('gulp-sourcemaps');
var concat            = require('gulp-concat');
var uglify            = require('gulp-uglify');
var notify            = require('gulp-notify');
var plumber           = require('gulp-plumber');
var imagemin          = require('gulp-imagemin');
var shopify           = require('gulp-shopify-upload');
var watch             = require('gulp-watch');
var rename            = require('gulp-rename');
var filter            = require('gulp-filter');
var flatten           = require('gulp-flatten');

var del               = require('del');
var argv              = require('yargs').argv;
var runsequence       = require('run-sequence');
var config            = require('./config.json');

var plumberErrorHandler = {
  errorHandler: notify.onError({
    title: 'Gulp',
    message: "Error: <%= error.message %>"
  })
};

gulp.task('styles', function() {
  return gulp.src(['dev/styles/updates.scss'])
    .pipe(plumber(plumberErrorHandler))
    .pipe(sourcemaps.init())
    .pipe(sass({ errLogToConsole: true }))
    .pipe(autoprefixer({ browsers: ['last 2 versions', 'ie >= 10', 'Android >= 4.3'] }))
    .pipe(cssmin())
    .pipe(sourcemaps.write())
    .pipe(rename({ suffix: '.css', extname: '.liquid' }))
    .pipe(gulp.dest('deploy/assets'));
});

gulp.task('scripts', function() {
  return gulp.src(['dev/scripts/**'])
    .pipe(plumber(plumberErrorHandler))
    .pipe(sourcemaps.init())
    .pipe(concat('main.js'))
    .pipe(uglify())
    .pipe(sourcemaps.write())
    .pipe(rename({ suffix: '.js', extname: '.liquid' }))
    .pipe(gulp.dest('deploy/assets'));
});

gulp.task('vendor', function() {
  var styles = filter(['styles/**/*.scss']);
  var scripts = filter(['scripts/**/*.js']);
  return gulp.src(['dev/vendor/**'])
    .pipe(plumber(plumberErrorHandler))
    .pipe(styles)
    .pipe(sass({ errLogToConsole: true }))
    .pipe(cssmin())
    .pipe(styles.restore())
    .pipe(scripts)
    .pipe(concat('vendor.js'))
    .pipe(uglify())
    .pipe(scripts.restore())
    .pipe(flatten())
    .pipe(gulp.dest('deploy/assets'));
});

gulp.task('copy', function() {
  return gulp.src(['dev/liquid/**'], {base: 'dev/liquid'})
    .pipe(plumber(plumberErrorHandler))
    .pipe(newer('deploy/'))
    .pipe(gulp.dest('deploy/'));
});

gulp.task('clean', function(cb) {
    del(['deploy/**/*'], cb);
});

gulp.task('imagemin', function() {
  return gulp.src(['dev/liquid/assets/*'])
    .pipe(imagemin({ optimizationLevel: 5, progressive: true, interlaced: true }))
    .pipe(gulp.dest('dev/liquid/assets/'));
});

gulp.task('build', ['clean'], function(cb) {
  runsequence(['copy', 'styles', 'scripts', 'vendor'], cb);
});

gulp.task('watch', ['build'], function() {
  gulp.watch(['dev/styles/**/*.scss'], ['styles']);
  gulp.watch(['dev/scripts/**/*.js'], ['scripts']);
  gulp.watch(['dev/vendor/**/*.{js,scss}'], ['vendor']);
  gulp.watch(['dev/liquid/**'], ['copy']);
});

gulp.task('upload', ['watch'], function() {
  if (!argv.env) {
    return false;
  } else if (argv.env && config.shopify.hasOwnProperty(argv.env)) {
    env = config.shopify[argv.env];
  } else {
    env = config.shopify.dev;
  }
  return watch('deploy/{assets|layout|config|snippets|templates|locales}/**')
    .pipe(shopify(env.apiKey, env.password, env.url, env.themeId, env.options));
});

gulp.task('default', ['clean', 'build', 'watch', 'upload']);

我遇到的问题与upload任务和copy任务直接相关。

在运行gulp --env [environment-name]（例如gulp --env staging）或只是gulp --env时，有时当我保存位于 的子目录之一中的文件时 dev/liquid/，copy任务会按预期运行，然后通过上传单个保存和复制的文件。upload任务。但是，有时我会保存一个文件并且copy任务照常运行，但随后手表upload会发疯并尝试上传其中的每个文件deploy/（这会导致 api 调用限制错误，这自然会给我带来问题）。

我最初gulp-changed在我的copy任务中使用过，但后来注意到它只会做 1:1 映射而不是目录（不确定我在这方面有多正确）。所以我切换到gulp-newer，并且事情工作了一段时间，但后来事情又开始吓坏了。

我不知道是什么原因造成的，我有我的怀疑，但我不知道如何对它们采取行动。任何建议、观察、改进建议、浪漫晚餐的好地方、可靠的宠物保姆等都将不胜感激。

特技特技！！！

_t

编辑：我一直很难重现这个怪胎（即所有文件都试图一次上传），有时运行相同gulp --env staging的文件会导致怪胎，而其他时候在同一组文件上启动相同的任务确实没有什么。也许它可能与 gulp-newer 和 gulp-changed 使用 date modified 作为比较有关？

双重编辑：也许这是一种竞争条件，因为它有时有效，有时无效？我记得在 node-glob 或 minimatch github 页面上看到了一些关于竞争条件的内容......

4

0 回答 0