gatsbyjs/gatsby

Enable gatsby-plugin-sass to allow sass-embedded

Schweinepriester opened this issue · 1 comments

Preliminary Checks

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

"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