From f935c5a9fa9fbfe7c959ae7c464e5894c7e38c82 Mon Sep 17 00:00:00 2001
From: Bryce Wray <bwray@wraytx.com>
Date: Mon, 2 Aug 2021 01:52:58 -0500
Subject: [PATCH] Update styling.md re link-handling for .scss files (#977)

Adding a note to make clear that users of .scss files should still link to the final compiled .css files, as per https://discord.com/channels/830184174198718474/853350631389265940/871151798075949066.
---
 docs/src/pages/guides/styling.md | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/docs/src/pages/guides/styling.md b/docs/src/pages/guides/styling.md
index cbf1e2713..ed1ebc1f6 100644
--- a/docs/src/pages/guides/styling.md
+++ b/docs/src/pages/guides/styling.md
@@ -112,7 +112,9 @@ Astro also supports [Sass][sass] out-of-the-box. To enable for each framework:
 - **Vue**: `<style lang="scss">` or `<style lang="sass">`
 - **Svelte**: `<style lang="scss">` or `<style lang="sass">`
 
-💁‍ Sass is great! If you haven't used Sass in a while, please give it another try. The new and improved [Sass Modules][sass-use] are a great fit with modern web development, and it's blazing-fast since being rewritten in Dart. And the best part? **You know it already!** Use `.scss` to write familiar CSS syntax you're used to, and only sprinkle in Sass features if/when you need them.
+💁‍ Sass is great! If you haven't used Sass in a while, please give it another try. The new and improved [Sass Modules][sass-use] are a great fit with modern web development, and it's blazing-fast since being rewritten in Dart. And the best part? **You know it already!** Use `.scss` to write familiar CSS syntax you're used to, and only sprinkle in Sass features if/when you need them.'
+
+**Note**: If you use .scss files rather than .css files, your stylesheet links should still point to .css files because of Astro’s auto-compilation process. When Astro “needs” the styling files, it’ll be “looking for” the final .css file(s) that it compiles from the .scss file(s). For example, if you have a .scss file at `./public/style/global.scss`, use this link: `<link rel="stylesheet" href="/style/global.css">` — **not** `<link rel="stylesheet" href="/style/global.scss">`.
 
 ### 🍃 Tailwind