Wie schreibe ich zwei CSS-Dateien: mit und ohne Quellkarte

Question

Ich brauche zwei zusammengeführte CSS-Dateien in einem Verzeichnis - eins mit Quellkarte und ein anderes ohne. Was ich zum Beispiel versucht, ist so etwas wie dieses:

.pipe(sourcemaps.init()) 
.pipe(concat('xxx.dev.min.css')) 
.pipe(sourcemaps.write()) 
.pipe(gulp.dest(cssDir)) 
.pipe(sourcemaps.init({loadMaps:true})) 
.pipe(concat('xxx.min.css')) 
.pipe(sourcemaps.write('/dev/null', {addComment: false})) 
.pipe(gulp.dest(cssDir)) 

Alle meine in Folge Der Versuch, entweder beide Dateien eine sourcemap, die beide keinen sourcemap oder ein zu haben, die sourcemap auf einem anderen, nicht auf die Originaldateien.

Kann dies nur mit Schluck-Quellkarten erreicht werden und wie und wenn nicht, wie?

Answer 1

denke ich Folgendes sollte funktionieren:

Das die verketteten withoutSourcemap.css in das Zielverzeichnis sendet, bevor Quellenzuordnungen generiert wurden. Wir benennen die Datei dann einfach in withSourcemap.css um. Erst danach wird die Quellkarte in den Stream geschrieben und an das Zielverzeichnis gesendet.

EDIT: Dies ist die withSourcemap.css in meinem Fall generiert:

.one { color:red; } 

.two { color:blue; } 

/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm9uZS5jc3MiLCJ0d28uY3NzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBO0FBQ0E7QUNEQTtBQUNBIiwiZmlsZSI6IndpdGhTb3VyY2VtYXAuY3NzIiwic291cmNlc0NvbnRlbnQiOlsiLm9uZSB7IGNvbG9yOnJlZDsgfVxuIiwiLnR3byB7IGNvbG9yOmJsdWU7IH1cbiJdLCJzb3VyY2VSb290IjoiL3NvdXJjZS8ifQ== */ 

Base64-Decodierung der eingebetteten Quelle Karte ergibt die folgende:

{"version":3,"sources":["one.css","two.css"],"names":[],"mappings":"AAAA;AACA;ACDA;AACA","file":"withSourcemap.css","sourcesContent":[".one { color:red; }\n",".two { color:blue; }\n"],"sourceRoot":"/source/"}