1

event-streamSASS をコンパイルして、1 つのタスクで CSS とマージできるように使用しています。私の唯一の問題はsourcemap、CSS内でマージされていることです。

ガルプコード

gulp.task('css', function(){

    var sassGlob = "assets/css/**/*.scss";
    var cssGlob = "assets/css/**/*.css";;
    var dest = "./dist/css/min/'";

    // compile sass
    var sassFiles = gulp.src(sassGlob)
    .pipe(plugins.rubySass({
        style: 'expanded', precision: 2
    }));

    // concatenate css + compiled sass
    return es.concat(gulp.src(cssGlob), sassFiles)
        .pipe(plugins.concat('style.min.css'))
        .pipe(gulp.dest(paths.styles.dest));
});

ソース: main.SCSS

header {
  padding: 2px;
}

ソース: main2.css

body {
    padding: 2px;
}

出力: style.min.css

body {
    padding: 2px;
}

header {
  padding: 2px;
}

/*# sourceMappingURL=main.css.map */

{
"version": 3,
"mappings": "AAAA,IAAK;EACD,OAAO,EAAE,GAAG",
"sources": ["../main.scss"],
"names": [],
"file": "main.css"
}

私が試したこと

1)試した: ruby​​Sass の sourcemap を false に設定結果:違いなし

.pipe(plugins.rubySass({
    style: 'expanded', sourcemap: 'none', precision: 2
}));

  1. 試してみました: gulp-concat-sourcemap、これにより外部ソースマップファイルが作成されますが、まだ内部にもありますstyle.min.css

    return es.concatSourceMap(gulp.src(cssGlob), sassFiles) .pipe(plugins.concat('style.min.css')) .pipe(gulp.dest(paths.styles.dest));

結果のソースマップの出力を調べたところ、これに気付きました

{
  "version": 3,
  "file": "style.min.css",
  "sources": [
    "assets/css/other.css",
    "main2.css",
    "main2.css.map"
  ],
  "names": [],
  "mappings": "AAAA;AACA;AACA;;ACFA;AACA;AACA;AACA;AACA;AACA;;ACLA;AACA;AACA;AACA;AACA;AACA;AACA"
}

それに基づいて、.map ファイルを CSS に連結しているように見えますが、これが私たちが目にする動作です。ということで、濾してみました。

3)試してみました:gulp-filter css で連結されないようにマップファイルを除外するために使用しました結果:違いはありません

return es.merge(cssFiles, sassFiles)
        .pipe($.filter("!*.map))

"））

4

1 に答える 1

3

少し前に同じ問題に遭遇しました。これは、 dargsを使用してパラメーターがsass gemに渡される方法に関連しています。詳細については、こちらを参照してください。

ただし、 #114以降、これは機能するはずです。

@milesjによって1 つのちょっとしたハッキーな解決策が提供され、今のところ問題を修正しています。

.pipe(plugins.rubySass({
  style: 'expanded', 'sourcemap=none': true, precision: 2
}));
于 2014-11-05T21:49:13.067 に答える