Deprecation warning with newest Dart Sass (1.79.2)

[stefangabos]

Updated 2024-Nov-17

Since the author of this repository did not provide a fix and still a lot of projects seem to be relying on it, I decided to fork this repository, add the fix created by Matt Robinson via this commit, and provide information about what can be done to properly update your code and not just silence the warning.

I have also fixed the broken sourceMap option.

The fork with the fix is called grunt-sass-modern and you will find all the information you need to migrate seamlessly.

Original issue report

With the newest Dart Sass, I am getting

Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.

According to their docs we can pass this option to silence the warning: silenceDeprecations: ['legacy-js-api'] (and it does work)

So, having something like

minified: {
    options: {
        silenceDeprecations: ['legacy-js-api'],
        implementation: sass,
        outputStyle: 'compressed'
    },
    files: {
        'path/to/compiled': 'path/to/source'
    }
}

does the job of silencing the warning.

They mention that setting an api option to modern should actually be used instead but setting it has no effect.

Help?

[mattyrob]

I believe a fix / enhancement to the current code that will make use of the newer API can be achieved as follows.

In tasks/sass.js after line 22, add a new line for scope `result:

const [src] = item.src;
let result;

Then replace the code from line 27:

const result = await util.promisify(options.implementation.render)(Object.assign({}, options, {
	file: src,
	outFile: item.dest
}));

with the following:

if ('modern' === options.api) {
	result = await options.implementation.compileAsync(src , options);
} else {
	result = await util.promisify(options.implementation.render)(Object.assign({}, options, {
		file: src,
		outFile: item.dest
	}));
}

This will introduce the option to pass api and if it is defined as modern then the newer sass functions are called to create the css output.

[stefangabos]

I confirm that @mattyrob's changes work as expected.

For anyone else wanting to try it out, replace in your package.json file the call to

"grunt-sass": "^3.1.0",

with

"grunt-sass": "github:mattyrob/grunt-sass#add/modern-api",

and do a npm install.

Alternatively, making a call to

npm i https://github.com/mattyrob/grunt-sass.git#add/modern-api

in your project's folder will do the change for you in package.json

[stefangabos]

I created a fork with the fix from @mattyrob and made it available as a new npm package called grunt-sass-modern so that it feels less hack-ish.