From e3b8c62969d680d1915a122c610d281d6711aa63 Mon Sep 17 00:00:00 2001 From: Arsh <69170106+lilnasy@users.noreply.github.com> Date: Mon, 5 Jun 2023 19:58:29 +0530 Subject: [PATCH] Stabilize inline stylesheets (#7180) * changeset * chore(inline stylesheets config): stabilize * grammar * not a major change * Update inlineStylesheets version in the configuration reference Co-authored-by: Sarah Rainsberger --------- Co-authored-by: Sarah Rainsberger --- .changeset/stupid-pumpkins-perform.md | 24 +++++++++++ packages/astro/src/@types/astro.ts | 43 +++++++++---------- .../src/core/build/plugins/plugin-css.ts | 2 +- packages/astro/src/core/config/schema.ts | 14 +++--- .../astro/test/css-inline-stylesheets.test.js | 12 +++--- 5 files changed, 61 insertions(+), 34 deletions(-) create mode 100644 .changeset/stupid-pumpkins-perform.md diff --git a/.changeset/stupid-pumpkins-perform.md b/.changeset/stupid-pumpkins-perform.md new file mode 100644 index 000000000000..663800891e1d --- /dev/null +++ b/.changeset/stupid-pumpkins-perform.md @@ -0,0 +1,24 @@ +--- +'astro': minor +--- + +The Inline Stylesheets RFC is now stable! + +You can now control how Astro bundles your css with a configuration change: + +```ts +export default defineConfig({ + ... + build: { + inlineStylesheets: "auto" + } + ... +}) +``` + +The options: +- `inlineStylesheets: "never"`: This is the behavior you are familiar with. Every stylesheet is external, and added to the page via a `` tag. Default. +- `inlineStylesheets: "auto"`: Small stylesheets are inlined into `