gulp-sourcemaps gera fontes incorretas em .css.map - gulp, gulp-sass, gulp-sourcemaps

Eu não consigo descobrir o que há de errado com minha configuração de gulp e gulp-sourcemaps. main.css e main.css.map são compilados, mas eu recebo fontes incorretas:

{"version":3,"file":"main.css","sources":["/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css","/assets/sass/main.css" [...] etc

Nunca exibe nada além de main.css como uma fonte. Quando eu inspeciono através do navegador e clico na fonte, ele me mostra último arquivo importado no SCSS.

Esta é a minha tarefa Gulp:

gulp.task("sass", function () {
return gulp.src(config.sass.src)
.pipe(sourcemaps.init({largeFile: true}))
.pipe(sass().on("error", sass.logError ))
.pipe(sourcemaps.write("."))
.pipe(gulp.dest(config.sass.dest));
});

Minhas config.sass.src é assets/sass/**/*.{sass,scss}

Eu também tive alguns autoprefixer canos e cssnano mas eu comentei todas as coisas extras e tentei executá-las, bem, as mesmas coisas.

Aqui está um exemplo mínimo do meu SCSS:

main.scss:

@import "components/buttons";

components/_buttons.scss:

button {
padding: 10px;
background: black;
color: white;
border: 0;
border-radius: 0;
}

Isso gera o seguinte no css.map:

{"version":3,"file":"main.css","sources":["/assets/sass/main.css","/assets/sass/main.css"],"sourcesContent":["@import "components/buttons";","button {n    padding: 10px;n    background: black;n    color: white;n    border: 0;n    border-radius: 0;n}"],"mappings":"ACAA,AAAA,MAAM,CAAC;EACH,OAAO,EAAE,IAAK;EACd,UAAU,EAAE,KAAM;EAClB,KAAK,EAAE,KAAM;EACb,MAAM,EAAE,CAAE;EACV,aAAa,EAAE,CAAE,GACpB","names":[]}

Usando:

• gole 3.9.1
• gulp-sass 2.3.2
• gulp-sourcemaps 1.10.0

Respostas:

1 para resposta № 1

Está um inseto na versão de gulp-sourcemaps que você está usando.

Atualizando de 1.10.0 para 1.10.1 deve corrigir o problema:

npm install --save-dev gulp-sourcemaps

---