Update docs
This commit is contained in:
parent
e6ad081950
commit
2fd5d7ce43
2 changed files with 25 additions and 0 deletions
|
@ -5,3 +5,27 @@
|
||||||
---
|
---
|
||||||
|
|
||||||
Update internal `shiki` syntax highlighter to `shikiji`. Existing docs on `shiki` still stays the same, but `shikiji` will help make bundling simpler and easier to maintain.
|
Update internal `shiki` syntax highlighter to `shikiji`. Existing docs on `shiki` still stays the same, but `shikiji` will help make bundling simpler and easier to maintain.
|
||||||
|
|
||||||
|
`shikiji` also produces a smaller HTML output by attaching fallback `color` styles on the `pre` or `code` element instead of to the line `span` directly. For example:
|
||||||
|
|
||||||
|
Before:
|
||||||
|
|
||||||
|
```html
|
||||||
|
<code class="astro-code" style="background-color: #24292e">
|
||||||
|
<pre>
|
||||||
|
<span class="line" style="color: #e1e4e8">my code</span>
|
||||||
|
</pre>
|
||||||
|
</code>
|
||||||
|
```
|
||||||
|
|
||||||
|
After:
|
||||||
|
|
||||||
|
```html
|
||||||
|
<code class="astro-code" style="background-color: #24292e; color: #e1e4e8">
|
||||||
|
<pre>
|
||||||
|
<span class="line">my code<span>
|
||||||
|
</pre>
|
||||||
|
</code>
|
||||||
|
```
|
||||||
|
|
||||||
|
This shouldn't affect most existing styles as assigning a color to `span` or `.line` didn't work before, but if you did create this style anyways, it may now indirectly affect syntax highlighting.
|
||||||
|
|
|
@ -81,6 +81,7 @@ const html = highlighter.codeToHtml(code, {
|
||||||
node.tagName = 'code';
|
node.tagName = 'code';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Cast to string as shikiji will always pass them as strings instead of any other types
|
||||||
const classValue = (node.properties.class as string) ?? '';
|
const classValue = (node.properties.class as string) ?? '';
|
||||||
const styleValue = (node.properties.style as string) ?? '';
|
const styleValue = (node.properties.style as string) ?? '';
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue