如何修复未处理的“错误”事件。使用 Gulp 时“A”的 @import 声明损坏？答案

【问题标题】：How to fix Unhandled 'error' event. Broken @import declaration of "A" while using Gulp?如何修复未处理的“错误”事件。使用 Gulp 时“A”的 @import 声明损坏？
【发布时间】：2015-04-24 14:58:46
【问题描述】：

我一直很高兴使用 gulp.js 进行编译，但今天下午我开始收到此错误：

events.js:72
        throw er; // Unhandled 'error' event
              ^
Error: Broken @import declaration of "A"

我的 gulpfile.js 看起来像这样：

var gulp = require('gulp'),
    minifyCSS = require('gulp-minify-css'),
    sass = require('gulp-ruby-sass'),
    imagemin = require('gulp-imagemin')
    minifyHTML = require('gulp-minify-html'),
    uglify = require('gulp-uglify'),
    fileinclude = require('gulp-file-include');

gulp.task('sass', function() {
    return sass('node_modules/foundation/scss/') 
    .on('error', function (err) {
      console.error('Error!', err.message);
   })
    .pipe(gulp.dest('publish/css'));
});

gulp.task('image', function(){
    gulp.src('images/*')
    .pipe(imagemin())
    .pipe(gulp.dest('publish/images'));
});

gulp.task('fileinclude', function() {
  gulp.src(['index.html'])
    .pipe(fileinclude({
      prefix: '@@',
      basepath: '@file'
    }))
    .pipe(gulp.dest('./html/'));
});

gulp.task('minify-css', function() {
  gulp.src('publish/css/*.css')
    .pipe(minifyCSS({keepBreaks:false}))
    .pipe(gulp.dest('publish/css'));
});

gulp.task('compress', function() {
  return gulp.src(['./node_modules/foundation/js/foundation/*.js','./node_modules/foundation/js/vendor/*.js'])
    .pipe(uglify())
    .pipe(gulp.dest('publish/js'));
});

gulp.task('minify-html', function() {
  var opts = {
    conditionals: true,
    spare:true
  };

  return gulp.src('./html/*.html')
    .pipe(minifyHTML(opts))
    .pipe(gulp.dest('./publish/'));
});


gulp.task('watch', function(){
    gulp.watch('node_modules/foundation/scss/', ['sass']);
    gulp.watch('publish/css/*', ['minify-css']);
    gulp.watch('publish/images/*', ['image']);
});

gulp.task('alpha', [ 'sass','fileinclude','minify-css','image','compress' ]);

gulp.task('omega', ['minify-html']);

gulp.task('build', ['alpha', 'omega']);

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

我已重新启动，尝试检查端口是否存在冲突，并在 Google 上搜索了此内容。

任何人都可以看到可能导致此问题的明显问题吗？

编辑：我应该补充一下，我正在使用 Foundation 框架。

【问题讨论】：

您的 CSS 文件似乎有问题。我认为这是因为您运行 minifyCSS 并将结果存储在同一目录中。您是否有理由在 Sass 调用后和新任务中不直接运行它？还有其他 CSS 文件吗？
你是否有一个导入语句，你尝试导入“A.css”？也许你可以在你的文件中给我们一个关于你的导入语句的要点
非常感谢。我看不到 A.css，但将编译后的 css 放入其自己的目录并然后将其缩小并将其放入发布目录似乎已经成功了。我还需要确保我在我的 ruby-sass 中使用了 compass，它修复了我遇到的编译错误。我怀疑我的 gulpfile 可能会更有效率，所以接下来我会看看...

标签： node.js gulp

【解决方案1】：

gulp-minify-css 包是我的罪魁祸首。我将此参数添加到我的gulpfile.js 文件中并修复了它：

processImport: false

例如：

.pipe(plugins.minifyCss({ keepSpecialComments: 1, processImport: false }))

【讨论】：

这个对我们帮助很大。我们在 Linux 上遇到了 1.2.4 版本的问题，即正确的 css @import 存在问题。在开发人员的 Windows 机器上，一切都很好。关闭导入处理帮助我们完成了在 Linux 服务器上执行的竹构建。谢谢和荣誉！
这似乎根本不包括导入？不知道如何解决问题
我正在使用 Grunt 并且能够解决我的错误 Broken @import declaration of ".." 多亏了这个