fix(gatsby-plugin-sass): Add support for additionalData option (#36086)

Co-authored-by: Lennart <lekoarts@gmail.com>
gatsbyjs · Jul 18, 2022 · 9a58b36 · 9a58b36
1 parent 80d219a
commit 9a58b36
Show file tree

Hide file tree

Showing 4 changed files with 83 additions and 0 deletions.
diff --git a/packages/gatsby-plugin-sass/README.md b/packages/gatsby-plugin-sass/README.md
@@ -64,6 +64,23 @@ plugins: [
 ]
 ```
 
+### additionalData
+
+Prepends Sass code before the actual entry file. In this case, the `sass-loader` will not override the data option but just prepend the entry's content. You might use this to prepend things like environmental variables (as Sass variables) or even prepend a global Sass import to be used in other Sass files (functions, mixins, variables, etc.).
+
+See [webpack's sass-loader documentation](https://webpack.js.org/loaders/sass-loader/#additionaldata) for reference.
+
+```javascript:title=gatsby-config.js
+plugins: [
+  {
+    resolve: `gatsby-plugin-sass`,
+    options: {
+      additionalData: "$env: " + process.env.NODE_ENV + ";",
+    },
+  },
+]
+```
+
 ### Alternative Sass Implementations
 
 By default, the Dart implementation of Sass (`sass`) is used. To use the implementation written in Node (`node-sass`), you can install `node-sass` instead of `sass` and pass it into the options as the implementation: