From 3921e21f85362007747e400afc7052476ca0afd5 Mon Sep 17 00:00:00 2001 From: bluwy Date: Mon, 21 Oct 2024 23:10:14 +0800 Subject: [PATCH 1/4] Add charset note md/mdx pages --- src/content/docs/en/basics/layouts.mdx | 6 ++++++ src/content/docs/en/guides/upgrade-to/v5.mdx | 16 ++++++++++++++++ 2 files changed, 22 insertions(+) diff --git a/src/content/docs/en/basics/layouts.mdx b/src/content/docs/en/basics/layouts.mdx index 82127b370db2a..e89fa5f8cd85d 100644 --- a/src/content/docs/en/basics/layouts.mdx +++ b/src/content/docs/en/basics/layouts.mdx @@ -234,6 +234,12 @@ const { title, fancyJsHelper } = Astro.props; Learn more about Astro’s Markdown and MDX support in our [Markdown guide](/en/guides/markdown-content/). +:::note + +When a layout is not used, Astro will automatically add a `` tag to your page to allow easier authoring of non-ASCII content. If you are using a layout for non-ASCII content, you should include the `` tag in your layout as Astro will no longer add it automatically. + +::: + ## Nesting Layouts Layout components do not need to contain an entire page worth of HTML. You can break your layouts into smaller components, and combine layout components to create even more flexible, page templates. This pattern is useful when you want to share some code across multiple layouts. diff --git a/src/content/docs/en/guides/upgrade-to/v5.mdx b/src/content/docs/en/guides/upgrade-to/v5.mdx index fb8dcf8a7a944..cc6e70345e48d 100644 --- a/src/content/docs/en/guides/upgrade-to/v5.mdx +++ b/src/content/docs/en/guides/upgrade-to/v5.mdx @@ -752,6 +752,22 @@ Code blocks in `.mdoc` files and Astro's built-in `` component do not us Read more about [syntax highlighting in Astro](/en/guides/markdown-content/#syntax-highlighting). +### Changed: Automatic `charset=utf-8` behavior for Markdown and MDX pages + + + +In Astro 4.0, Markdown and MDX pages (located in `src/pages/`) automatically responded with `charset=utf-8` in the `Content-Type` header, which allowed rendering non-ASCII characters in your pages. + +Astro 5.0 updates the behaviour to add the `` tag instead, and only for pages that do not use Astro's special `layout` frontmatter property. Similarly for MDX pages, Astro will only add the tag if the MDX content does not import a wrapping `Layout` component. + +If your Markdown or MDX pages use the `layout` frontmatter property, or if the MDX page content imports a wrapping `Layout` component, then the HTML encoding will be handled by the designated layout component instead, and the `` tag will not be added to your page by default. + +#### What should I do? + +If you require `charset=utf-8` to render your page correctly, make sure that your layout components contain the `` tag. You may need to add this if you have not already done so. + +Read more about [Markdown layouts](/en/basics/layouts/#markdown-layouts). + ### Changed: Astro-specific metadata attached in remark and rehype plugins From 40e162be2d009c3d5ceb4e58adec53c0b0545e85 Mon Sep 17 00:00:00 2001 From: sarahrainsberger Date: Wed, 23 Oct 2024 21:41:20 +0000 Subject: [PATCH 2/4] work changes throughout pages --- src/content/docs/en/basics/layouts.mdx | 31 ++++++++++++------- .../docs/en/guides/markdown-content.mdx | 8 +++-- 2 files changed, 25 insertions(+), 14 deletions(-) diff --git a/src/content/docs/en/basics/layouts.mdx b/src/content/docs/en/basics/layouts.mdx index e89fa5f8cd85d..ab9aaa300af12 100644 --- a/src/content/docs/en/basics/layouts.mdx +++ b/src/content/docs/en/basics/layouts.mdx @@ -100,7 +100,7 @@ const { title, description, publishDate, viewCount } = Astro.props; Page layouts are especially useful for individual Markdown pages which otherwise would not have any page formatting. -Astro provides a special `layout` frontmatter property intended for [individual `.md` files located within `src/pages/` using file-based routing](/en/guides/markdown-content/#individual-markdown-pages) to specify which `.astro` component to use as the page layout. By default, this specified component can automatically access data from the Markdown file. +Astro provides a special `layout` frontmatter property intended for [individual `.md` files located within `src/pages/` using file-based routing](/en/guides/markdown-content/#individual-markdown-pages) to specify which `.astro` component to use as the page layout. This component allows you to provide `` content like meta tags (e.g. ``) and styles for the Markdown page. By default, this specified component can automatically access data from the Markdown file. This is not recognized as a special property when using [content collections](/en/guides/content-collections/) to query and render your content. @@ -132,6 +132,8 @@ const { frontmatter } = Astro.props; + + {frontmatter.title} @@ -163,6 +165,7 @@ const { frontmatter, url } = Astro.props; --- + {frontmatter.title} @@ -225,20 +228,24 @@ Then, your values are available to you through `Astro.props` in your layout, and --- const { title, fancyJsHelper } = Astro.props; --- - -

{title}

- -

{fancyJsHelper()}

- + + + + + + + +

{title}

+ +

{fancyJsHelper()}

+ + + ``` -Learn more about Astro’s Markdown and MDX support in our [Markdown guide](/en/guides/markdown-content/). - -:::note - -When a layout is not used, Astro will automatically add a `` tag to your page to allow easier authoring of non-ASCII content. If you are using a layout for non-ASCII content, you should include the `` tag in your layout as Astro will no longer add it automatically. +When using any layout (either through the frontmatter `layout` property or by importing a layout), you must include the `` tag in your layout as Astro will no longer add it automatically to your MDX page. -::: +Learn more about Astro’s Markdown and MDX support in our [Markdown guide](/en/guides/markdown-content/). ## Nesting Layouts diff --git a/src/content/docs/en/guides/markdown-content.mdx b/src/content/docs/en/guides/markdown-content.mdx index ea808d07281e9..90b08f0cb0d0f 100644 --- a/src/content/docs/en/guides/markdown-content.mdx +++ b/src/content/docs/en/guides/markdown-content.mdx @@ -450,7 +450,7 @@ const content = marked.parse(markdown); Astro treats [any supported file inside of the `/src/pages/` directory](/en/basics/astro-pages/#supported-page-files) as a page, including `.md` and other Markdown file types. -Placing a file in this directory, or any sub-directory, will automatically build a page route using the pathname of the file and display the Markdown content rendered to HTML. +Placing a file in this directory, or any sub-directory, will automatically build a page route using the pathname of the file and display the Markdown content rendered to HTML. Astro will automatically add a `` tag to your page to allow easier authoring of non-ASCII content. ```markdown title="src/pages/page-1.md" --- @@ -492,6 +492,10 @@ This layout component is a regular Astro component with [specific properties aut const {frontmatter} = Astro.props; --- + + + // no longer added by default +

{frontmatter.title}

Post author: {frontmatter.author}

@@ -501,6 +505,6 @@ const {frontmatter} = Astro.props; ``` -You can also [style your Markdown](/en/guides/styling/#markdown-styling) in your layout component. +When using the frontmatter `layout` property, you must include the `` tag in your layout as Astro will no longer add it automatically. You can now also [style your Markdown](/en/guides/styling/#markdown-styling) in your layout component. Learn more about [Markdown Layouts](/en/basics/layouts/#markdown-layouts). From 3d3adb287fc96afc4c5142b392ec3ebfa7a3223a Mon Sep 17 00:00:00 2001 From: sarahrainsberger Date: Wed, 23 Oct 2024 21:43:08 +0000 Subject: [PATCH 3/4] code indentation --- src/content/docs/en/basics/layouts.mdx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/content/docs/en/basics/layouts.mdx b/src/content/docs/en/basics/layouts.mdx index ab9aaa300af12..daeae74b5a6f2 100644 --- a/src/content/docs/en/basics/layouts.mdx +++ b/src/content/docs/en/basics/layouts.mdx @@ -234,11 +234,11 @@ const { title, fancyJsHelper } = Astro.props; - -

{title}

- -

{fancyJsHelper()}

- + +

{title}

+ +

{fancyJsHelper()}

+ ``` From 6b1b9e844e02bea4b75e7b76a389f05d42b65411 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Wed, 23 Oct 2024 18:43:45 -0300 Subject: [PATCH 4/4] fix spacing --- src/content/docs/en/guides/markdown-content.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/docs/en/guides/markdown-content.mdx b/src/content/docs/en/guides/markdown-content.mdx index 90b08f0cb0d0f..ec3c210966bfa 100644 --- a/src/content/docs/en/guides/markdown-content.mdx +++ b/src/content/docs/en/guides/markdown-content.mdx @@ -493,7 +493,7 @@ const {frontmatter} = Astro.props; --- - + // no longer added by default