sassOptions 中的数据选项在升级到 v3 后停止在 gatsby-plugin-sass 中工作，并将 node-sass 替换为 sass

Question

我决定从我的 gatsby 项目中删除 node-sass 并改用 sass。我遵循了 v3 中提到的 here。我删除了 node-sass，现在我的 package.json:

中有这些版本

"gatsby-plugin-sass": "3.1.0",
"sass": "1.32.5",

我需要能够为全局 variables/mixins/functions 编写一些 @use 或 @import 规则，这样我就可以在我所有的 scss 文件中使用它们，这样我就不必重复相同的规则一遍又一遍。

使用 node-sass 这样的方法有效：

{
  resolve: `gatsby-plugin-sass`,
  options: {
    includePaths: [`${__dirname}/src/styles`],
    data: `@import "globals.scss";`,
  },
},

升级后，includePaths 属性有效，但 data 无效，我从我的 scss 文件中收到有关“缺少”变量的错误：

{
  resolve: `gatsby-plugin-sass`,
  options: {
    sassOptions: {
      includePaths: [`${__dirname}/src/styles`],
      data: `@use 'globals' as *;`,
    },
  },
},

如果我在每个 scss 文件中插入规则 @use 'globals' as *;，错误就会消失并且一切都按预期工作，但我不想插入这一行并修改我所有的 sass 文件。

我很确定这个问题与 sass-loader 和这个声明 (documentation) 有关，但我不知道如何让它工作以及为什么它以前工作：

ℹ️ Options such as data and file are unavailable and will be ignored.

Answer 1

根据 changelog，data 选项已重命名为 prependData，然后删除以支持 additionalData。所以：

{
  resolve: `gatsby-plugin-sass`,
  options: {
    additionalData: `@use 'globals' as *;`,
    sassOptions: {
      includePaths: [`${__dirname}/src/styles`],
    },
  },
},

sassOptions 中的数据选项在升级到 v3 后停止在 gatsby-plugin-sass 中工作，并将 node-sass 替换为 sass

data option in sassOptions stopped working in gatsby-plugin-sass after upgrading to v3 and replaced node-sass with sass

sass

gatsby

sass-loader

gatsby-plugin