From e44778432554044e3f5f4b6112963900ab637ed6 Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Mon, 3 Aug 2020 10:28:44 -0400 Subject: [PATCH] Explain Sass Extensions in CSS Docs Fixes #15737 --- docs/basic-features/built-in-css-support.md | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/docs/basic-features/built-in-css-support.md b/docs/basic-features/built-in-css-support.md index c40249a082631..ee44a2bbf47e0 100644 --- a/docs/basic-features/built-in-css-support.md +++ b/docs/basic-features/built-in-css-support.md @@ -117,6 +117,13 @@ npm install sass Sass support has the same benefits and restrictions as the built-in CSS support detailed above. +> **Note**: Sass supports [two different syntaxes](https://sass-lang.com/documentation/syntax), each with their own extension. +> The `.scss` extension requires you use the [SCSS syntax](https://sass-lang.com/documentation/syntax#scss), +> while the `.sass` extension requires you use the [Indented Syntax ("Sass")](https://sass-lang.com/documentation/syntax#the-indented-syntax). +> +> If you're not sure which to choose, start with the `.scss` extension which is a superset of CSS, and doesn't require you learn the +> Indented Syntax ("Sass"). + ### Customizing Sass Options If you want to configure the Sass compiler you can do so by using `sassOptions` in `next.config.js`.