Minor Changes
-
#13402
3e7b498
Thanks @ematipico! - Adds a new experimental flag calledexperimental.preserveScriptOrder
that renders<script>
and<style>
tags in the same order as they are defined.When rendering multiple
<style>
and<script>
tags on the same page, Astro currently reverses their order in your generated HTML output. This can give unexpected results, for example CSS styles being overridden by earlier defined style tags when your site is built.With the new
preserveScriptOrder
flag enabled, Astro will generate the styles in the order they are defined:import { defineConfig } from 'astro/config'; export default defineConfig({ experimental: { preserveScriptOrder: true, }, });
For example, the following component has two
<style>
tags, and both define the same style for thebody
tag:<p>I am a component</p> <style> body { background: red; } </style> <style> body { background: yellow; } </style>
Once the project is compiled, Astro will create an inline style where
yellow
appears first, and thenred
. Ultimately, thered
background is applied:body { background: #ff0; } body { background: red; }
When
experimental.preserveScriptOrder
is set totrue
, the order of the two styles is kept as it is, and in the style generatedred
appears first, and thenyellow
:body { background: red; } body { background: #ff0; }
This is a breaking change to how Astro renders project code that contains multiple
<style>
and<script>
tags in the same component. If you were previously compensating for Astro's behavior by writing these out of order, you will need to update your code.This will eventually become the new default Astro behavior, so we encourage you to add this experimental style and script ordering as soon as you are able! This will help us test the new behavior and ensure your code is ready when this becomes the new normal.
For more information as this feature develops, please see the experimental script order docs.
-
#13352
cb886dc
Thanks @delucis! - Adds support for a newexperimental.headingIdCompat
flagBy default, Astro removes a trailing
-
from the end of IDs it generates for headings ending with
special characters. This differs from the behavior of common Markdown processors.You can now disable this behavior with a new configuration flag:
// astro.config.mjs import { defineConfig } from 'astro/config'; export default defineConfig({ experimental: { headingIdCompat: true, }, });
This can be useful when heading IDs and anchor links need to behave consistently across your site
and other platforms such as GitHub and npm.If you are using the
rehypeHeadingIds
plugin directly, you can also pass this new option:// astro.config.mjs import { defineConfig } from 'astro/config'; import { rehypeHeadingIds } from '@astrojs/markdown-remark'; import { otherPluginThatReliesOnHeadingIDs } from 'some/plugin/source'; export default defineConfig({ markdown: { rehypePlugins: [ [rehypeHeadingIds, { experimentalHeadingIdCompat: true }], otherPluginThatReliesOnHeadingIDs, ], }, });
-
#13311
a3327ff
Thanks @chrisirhc! - Adds a new configuration option for Markdown syntax highlightingexcludeLangs
This option provides better support for diagramming tools that rely on Markdown code blocks, such as Mermaid.js and D2 by allowing you to exclude specific languages from Astro's default syntax highlighting.
This option allows you to avoid rendering conflicts with tools that depend on the code not being highlighted without forcing you to disable syntax highlighting for other code blocks.
The following example configuration will exclude highlighting for
mermaid
andmath
code blocks:import { defineConfig } from 'astro/config'; export default defineConfig({ markdown: { syntaxHighlight: { type: 'shiki', excludeLangs: ['mermaid', 'math'], }, }, });
Read more about this new option in the Markdown syntax highlighting configuration docs.
Patch Changes
-
#13404
4e78b4d
Thanks @ascorbic! - Fixes a bug in error handling that saving a content file with a schema error would display an "unhandled rejection" error instead of the correct schema error -
#13379
d59eb22
Thanks @martrapp! - Fixes an edge case where the client router executed scripts twice when used with a custom swap function that only swaps parts of the DOM. -
#13393
6b8fdb8
Thanks @renovate! - Updatesprimsjs
to version 1.30.0, which adds support for more languages and fixes a security advisory which does not affect Astro. -
#13374
7b75bc5
Thanks @ArmandPhilippot! - Fixes the documentation of the i18n configuration wheremanual
was presented as a key ofrouting
instead of an available value. -
#13380
9bfa6e6
Thanks @martrapp! - Fixes an issue where astro:page-load fires before all scripts are executed -
#13407
0efdc22
Thanks @ascorbic! - Displays correct error message when sharp isn't installed -
Updated dependencies [
cb886dc
,a3327ff
]:- @astrojs/markdown-remark@6.3.0