Mak*_* K. 5 sass sass-loader gatsby gatsby-plugin
我决定node-sass从我的 gatsby 项目中删除并使用sass。我遵循了此处针对 v3提到的内容。我删除了node-sass,现在我有这些版本package.json:
"gatsby-plugin-sass": "3.1.0",
"sass": "1.32.5",
Run Code Online (Sandbox Code Playgroud)
我需要能够一次性为全局变量/mixins/函数编写一些 @use 或 @import 规则,以便我可以在所有 scss 文件中使用它们,因此我不必一遍又一遍地重复相同的规则。
有了node-sass这样的工作:
{
resolve: `gatsby-plugin-sass`,
options: {
includePaths: [`${__dirname}/src/styles`],
data: `@import "globals.scss";`,
},
},
Run Code Online (Sandbox Code Playgroud)
升级后,该includePaths属性有效但data无效,我从我的 scss 文件中收到有关“丢失”变量的错误:
{
resolve: `gatsby-plugin-sass`,
options: {
sassOptions: {
includePaths: [`${__dirname}/src/styles`],
data: `@use 'globals' as *;`,
},
},
},
Run Code Online (Sandbox Code Playgroud)
如果我@use 'globals' as *;在每个 scss 文件中插入规则,错误就会消失,一切都按预期工作,但我不想插入这一行并修改我所有的 sass 文件。
我很确定这个问题sass-loader与此声明(文档)有关,但我无法弄清楚如何使其工作以及为什么它以前有效:
?? 数据和文件等选项不可用,将被忽略。
根据变更日志,data选项已被重命名为prependData,然后被删除以支持additionalData. 所以:
{
resolve: `gatsby-plugin-sass`,
options: {
additionalData: `@use 'globals' as *;`,
sassOptions: {
includePaths: [`${__dirname}/src/styles`],
},
},
},
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
472 次 |
| 最近记录: |