私のGulp Sassタスクのソースマップは動作しません

Question

SassのGulpタスクに問題があります。これはソースマップを生成しません。問題はこのタスクだけです。私の.jsのソースマップは正常に動作します。

誰でも私の仕事をチェックできますか？

gulp.task('build-css', function() { 
    gulp.src(['src/scss/vendor.scss', 'src/scss/styles.scss']) 
     .pipe(plumber()) 
     .pipe(sourcemaps.init({loadMaps: true})) 
     .pipe(sass.sync()) 
     .pipe(sourcemaps.write())   
     .pipe(concatCss("main.css")) 
     .pipe(autoprefixer({browsers: ['last 10 versions', 'IE 10']}))    
     .pipe(gulp.dest('build/css/')) 
     .pipe(browserSync.stream()); 
}); 

Answer 1

「答えてください」と答えてください。あなたはバックトラック法により、デバッグを使用して、この簡単なスクリプトをデバッグの試すことができます。

デバッグを小さなアプリケーションでは

をバックトラックによって、バックトラッキングのプロセスが頻繁にバグを特定するのに効果的に使用されています。このプロセスを適用するには、間違った出力が生成された場所でアプリケーションの位置から開始し、アプリケーションを1ステップ後退させて、逆順にアプリケーションを精神的にデバッグして、前のステップでアプリケーションのステータスを取得します。このようにして、バグは、アプリケーションの状態が予想されていた位置と、状況が予測できなかった最初の位置との間で制限されます。

この方法を適用すると、盗聴されたパイプが見つかるまで行単位で削除されます。この場合は、gulp-concat-cssプラグインで、あなたのソースマップの更新を正しく処理していません。

あなたはJSとCSSファイルでうまく動作ジェネリックgulp-concatプラグインと一緒に行く、そうでその行を置き換える連結の必要がある場合：私は、生産上の展開から除外することができるようにも、私は外部のマップファイルを好む

.pipe(concat('main.css')) 

一般的には本番環境に展開する必要がある.cssファイルサイズを節約できます。あなたがしていることを行うことができます

：

.pipe(sourcemaps.write('./)) 

はそれがお役に立てば幸いです。