gulp-useref 构建 concat 脚本和 css 但不替换 <--!构建 --> 在 html 中

Question

我使用 gulp-usref、gulp-if、gulp-uglify、gulp-csso 和 gulp-file-include 来构建我的应用程序。除了 HTML 保持原样外，构建中的一切都运行良好。我的 gulp 文件是这样设置的:

gulp.task('html', ['diststyles', 'scripts'], function () {
var assets = $.useref.assets();

return gulp.src('app/*.html')
    .pipe(assets)
    .pipe(gulpif('*.js', uglify()))
    .pipe(gulpif('*.css', minifyCss()))
    .pipe(assets.restore())
    .pipe(useref())
    .pipe(gulp.dest('dist'))
    .pipe($.size());
});

diststyles 和脚本是这样设置的:

gulp.task('diststyles', function () {
return gulp.src('app/styles/scss/*.scss')
    .pipe($.sass({
        errLogToConsole: true,
        includePaths: ['app/bower_components/foundation/scss'],
    }))
    .pipe($.autoprefixer('last 2 version'))
    .pipe(gulp.dest('app/styles'))
    .pipe(reload({stream:true}))
    .pipe($.size())
    .pipe($.notify("Compilation complete."));
});

gulp.task('scripts', function () {
return gulp.src('app/scripts/**/*.js')
    .pipe($.jshint())
    .pipe($.jshint.reporter(require('jshint-stylish')))
    .pipe($.size());
});

我使用的文件结构是这样的:

root
+-- app
    +-- bower_components
    +-- components
        header.html
        footer.html
    +-- pages
        home.html
    +-- scripts
        main.js
    +-- svg
+-- dist
    +-- scripts
        +-- vendor
            modernizr.js
        main.js
        plugins.js
        vendor.js
    +-- styles
        main.css
    home.html

当我首先运行 gulp 时，我将组件包含到 html 页面(ina pages 文件夹)并将它们复制到 app 文件夹。表单应用程序文件夹(包含完成后)html 开始。我把我所有的 js 和 css 文件连接起来并按原样复制到 dist，但在 html 文件中它是这样的:

<!-- build:css({.tmp,app}) styles/menu.css -->
<link rel="stylesheet" href="styles/menu.css">
<link rel="stylesheet" href="styles/fonts.css">
<!-- endbuild -->`

有什么想法导致问题以及如何解决这个问题吗？

Answer 1

我遇到了同样的问题，但解决方案有所不同。原来问题是由行结尾引起的。

最初我的文件使用 Windows 风格的行结尾。那一次一切正常。当我将其更改为 unix 样式的行结尾时，它出错了。症状与 bigcat 描述的相同。

我不认为 unix 风格的行结尾通常是错误的。 (显然它们不是。:))我使用的不同文件之间可能存在一些错位。我没有时间进一步调查，但如果您有此类症状，那么最好知道从哪里开始。