Absolute instead of relative paths in sourcemap with dart-sass

[ghost]

I have the following example config in Gruntfile.js:

sass: {
    dev_dartsass: {
        options: {
            implementation: require('sass'),
            sourceMap: true,
        },
        files: {'test.dartsass.css': 'test.scss'}
    },
    dev_nodesass: {
        options: {
            implementation: require('node-sass'),
            sourceMap: true,
        },
        files: {'test.nodesass.css': 'test.scss'}
    },
},

The output of the two mapping files is:

test.dartcss.css.map

{"version":3,"sourceRoot":"","sources":["file:///C:/www/myproject/assets/test.scss"],"names":[],"mappings":"AAAA;EACI","file":"test.dartsass.css"}

test.nodecss.css.map:

{
    "version": 3,
    "file": "test.nodesass.css",
    "sources": [
        "test.scss"
    ],
    "names": [],
    "mappings": "AAAA,AAAA,CAAC,CAAC;EACE,KAAK,EAAE,GAAG,GACb"
}

You can see that test.dartcss.css.map contains absolute paths instead of relative paths to the sources. The sass cli command has the following property to control this:

    --source-map-urls          How to link from source maps to source files.
                               [relative (default), absolute]

How can we tell grunt-sass/dart-sass to use relative paths?

[ghost]

Is this repo still maintained? I don't think it can be answered in one of the Sass-parser repo's since it's the specific implementation of grunt-sass that seems to cause this issue.

[IceCreamYou]

I think that dart-sass does not support relative files in the sources field as of https://github.com/sass/dart-sass/pull/1021 when it's not writing the files to disk. I'm not sure why that change was made. The official sass API documentation also says:

The source map uses absolute file: URLs to link to the Sass source files, except if the source file comes from the data option in which case it lists its URL as stdin.

I haven't yet figured out if there's a way around this.

[petertwise]

Not sure there's much to be done here as node-sass is basically telling people to use dart-sass for continued support and you're right that it looks like they are forcing stdout to use absolute urls.

Just reemphasizing that this is sad since the default for sass --source-map-urls is relative in dart-sass and this issue means that each time a new developer works on any of our projects and any css compiling is triggered, they are checking in their new absolute URLs from their local machine for every single map file.

[timint]

I just migrated to dart-sass and discovered all sourcemap paths are now absolute instead of relative. Passing "source-map-urls" = "relative" or sourceMapUrls = "relative" under options has no effect. Anyone find a solution?

[kgiglia]

We're also having this issue, would love to know if there has been any movement.

[petertwise]

What about this approach? - using sourceMapContents to make bigger but more dependable map files? Is that possible here, or still not possible because we're using the API and not command line?

https://github.com/cferdinandi/build-tool-boilerplate/issues/7#issuecomment-811901181

[petertwise]

This feels like a totally crazy hack approach that should not be necessary, but for now, I'm using grunt-string-replace to get this done:

'string-replace': {
    dist: {
        files: [
            {
                expand: true,
                cwd: 'dist/css/',
                src: '*.min.css.map',
                dest: 'dist/css/',
            },
        ],
        options: {
            replacements: [
                // place files inline example
                {
                    pattern: /(file:\/\/\/([^,]*)\/wp-content)+/g,
                    replacement: '/wp-content',
                },
            ],
        },
    },
},