私は縮小された1つのCSSファイルを作成しようとしていますが、頻繁に発生する本番環境でデバッグする必要がある場合に備えて、ソースマップが含まれています。これは動作しません。以下のコードを使用する場合:以下のように詰め込みます:実行していない、コンカットし、ソースマップでCSSを小さくしますか?
gulp.task('process:css', function() {
return gulp.src([paths.css, paths.less, "!" + paths.minCss])
.pipe(sourcemaps.init())
.pipe(less())
.pipe(concat(paths.concatCssDestMin))
.pipe(cleanCss())
.pipe(sourcemaps.write("."))
.pipe(gulp.dest("."));
});
すべてのプロセスが動作し、すべての生成が行われますが、最終的なmin.cssは正しく動作しますが、ソースマップはブラウザの主張でデバッグされ、すべてのスタイルの参照は最初の参照ファイルソースの1行目または2行目ソースマップ:私はプロセスから()cssminを削除し、それを実行した場合
しかし、すべてがソースマップを含め、動作します。ソースマップは、それらをすべて1つに結びつけても元のファイルを参照します。
私は間違っていますか?どうすればこれを達成できますか?
EDIT:cleanCssにmincssから切り替えるとき vegasjeのアドバイスを1として、私はしかし、間違ったプラグインを使用していた、私はまだ独身min.cssファイルを元のファイルにマップすることができません。私はcleanCss()コマンドを削除すると、再び、しかし
{"version":3,"sources":["wwwroot/css/site.min.css"],"names":[],"mappings":..."
:それだけconcattedファイルを参照します。元の地図の外観が正しいと思われます。
{"version":3,"sources":["bootstrap.custom.css","kendo.custom.css","kendobootstrapfix.css","main.css","yamm.css","theme.less"],"names":[],"mappings":"A....
ただし、それは縮小されていません。
が、これはブラウザがマップファイルを読んでいない削除、ありがとう、それでも、マップファイルが参照のみ連結されたsite.min.cssファイルで、個々のファイルは含まれていません。これは、この回答に基づいて意図したとおりに動作しているようです:https://stackoverflow.com/questions/32502678/gulp-uglify-and-sourcemaps/32504135#32504135しかし、私は地図を保存したいので、それは役に立たない元のファイルにコピーします。別の方法があるかどうかはわかりません。これと同じことが適用されます。私はcleanCssコマンドを削除しても正しく動作します。問題は縮小後にのみ発生します。 – SventoryMang
おかげで編集が助けになりました!小さな括弧は、連結されたファイルでファイルごとに1行ずつファイルを縮小したものです。それは私には関係ありません。 – SventoryMang