Enable gatsby-plugin-sass to allow sass-embedded

[Schweinepriester]

Preliminary Checks

• This issue is not a duplicate. Before opening a new issue, please search existing issues: https://github.com/gatsbyjs/gatsby/issues
• This issue is not a question, feature request, RFC, or anything other than a bug report directly related to Gatsby. Please post those things in GitHub Discussions: https://github.com/gatsbyjs/gatsby/discussions

Description

sass-loader was recently updated to v14.2.0

14.2.0 (2024-04-11)

Features

• added the modern-compiler value for API to reuse compiler process (#1195) (cef40a8)
• support webpack built-in resolver for modern and modern-compiler API (#1197) (2265b72)

Notes:

Using the modern-compiler value for the api option together with sass-embedded reduces compilation time by 5-10 times, especially for projects using large files with a lot of @import/@use, for small files the build time reduction will not be significant.

but it's not possible to use that with gatsby-plugin-sass, since it uses ^10.4.1, see

gatsby/packages/gatsby-plugin-sass/package.json

Line 12 in 9584173

"sass-loader": "^10.4.1"

resulting in

Unknown Sass implementation "sass-embedded".

when attempting to do so.

It would be great if gatsby-plugin-sass would be enabled to utilized sass-embedded, gaining the (potential) performance improvements.

Reproduction Link

https://github.com/gatsbyjs/gatsby/blob/master/packages/gatsby-plugin-sass/package.json#L12

Steps to Reproduce

1. Attempt to use sass-embedded, e.g.

   {
     resolve: 'gatsby-plugin-sass',
     options: {
       implementation: require('sass-embedded'),
       sassOptions: {
         api: 'modern-compiler',
       },
     },
   },

   in the plugins array.

2. See build log

Expected Result

Works

Actual Result

Unknown Sass implementation "sass-embedded".

Environment

Everywhere

Config Flags

No response

[Kearnol]

To add on here, our project is also currently getting the following warning when using gatsby-plugin-sass with sass v1.79.1
Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.

The plugin should allow the user to specify the api property as modern or mondern-compiler under sassOptions, but given that the current version of sass-loader used by the plugin is ~10.4.1, this option is not supported.

Please update the sass-loader dependency so that the api option can be configured and this warning can be addressed.

See: https://sass-lang.com/documentation/breaking-changes/legacy-js-api/