generated sourcemaps missing path

[dungdm93]

I use autoprefixer with gulp, but generated sourcemaps seem to have only files name in sources attribute.

src
|- app
|   \- components.css
\- main.css

// gulpfile.js
var $ = require("gulp-load-plugins")({ lazy: true });

gulp.task("compile:styles", function () {
    return gulp
        .src("./src/**/*.css")
        .pipe($.sourcemaps.init())
        .pipe($.autoprefixer())
        .pipe($.concat("styles/all.css"))
        .pipe($.sourcemaps.write(".", {includeContent: false, sourceRoot: '../src'}))
        .pipe(gulp.dest("./dist"));
});

Actual result:

// dist/styles/all.css.map

{"version":3,"sources":["styles.css","components.css"],"names":[],"file":"styles/all.css","sourceRoot":"../src","mappings":"..."}
// missing path ------------------------^

Expected result (when I disable autoprefixer):

{"version":3,"sources":["styles.css","app/components.css"],"names":[],"file":"styles/all.css","sourceRoot":"../src","mappings":"..."}

[ai]

You need to set sourceContent option to PostCSS.

[dungdm93]

I don't use autoprefixer as PostCSS plugin.
I use standalone gulp-autoprefixer

[ai]

There is no standalone Autoprefixer 😉. gulp-autoprefixer just have hidden PostCSS inside.

In Gulp you need to enable sourceContent in gulp-sourcemaps. PostCSS will use previous source map settings.

[dungdm93]

gulp-sourcemaps has no sourceContent option.
The only similar one is includeContent, but I'd like to use external source so... as you see, I set it false
{includeContent: false, sourceRoot: '../src'}

[ai]

includeContent is what you need, it will add sourceContent to map.

[ai]

Ouh, I found what you mean 😕

[ai]

Could you try gulp-postcss with autoprefixer. And if you will have problem open a issue in PostCSS repo?

Autoprefixer doesn't add maps, only PostCSS does it

[dungdm93]

:) Let me try.

[dungdm93]

gulp-postcss with autoprefixer work fine 👍
But should gulp-autoprefixer also support sourcemaps?

[ai]

It should, but maybe it contains some mistake?