fix(website): rehype shiki lazy load

This commit is contained in:
LukaDev 2024-10-12 23:22:46 +02:00
parent 119eef3f10
commit fc0e9f96cd
3 changed files with 22 additions and 24 deletions

Binary file not shown.

View file

@ -12,34 +12,34 @@
"format": "prettier --write ."
},
"devDependencies": {
"@sveltejs/adapter-vercel": "^5.4.4",
"@sveltejs/kit": "^2.6.1",
"@sveltejs/vite-plugin-svelte": "^4.0.0-next.7",
"@sveltejs/adapter-vercel": "^5.4.5",
"@sveltejs/kit": "^2.7.0",
"@sveltejs/vite-plugin-svelte": "^4.0.0-next.8",
"@tailwindcss/typography": "^0.5.15",
"@types/eslint": "^9.6.1",
"@types/gunzip-maybe": "^1.4.2",
"@types/tar-stream": "^3.1.3",
"autoprefixer": "^10.4.20",
"eslint": "^9.11.1",
"eslint": "^9.12.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-svelte": "^2.44.1",
"globals": "^15.9.0",
"globals": "^15.11.0",
"mdsvex": "^0.12.3",
"prettier": "^3.3.3",
"prettier-plugin-svelte": "^3.2.7",
"prettier-plugin-tailwindcss": "^0.6.8",
"svelte": "^5.0.0-next.260",
"svelte-check": "^4.0.4",
"svelte": "^5.0.0-next.264",
"svelte-check": "^4.0.5",
"tailwindcss": "^3.4.13",
"typescript": "^5.6.2",
"typescript-eslint": "^8.7.0",
"typescript": "^5.6.3",
"typescript-eslint": "^8.8.1",
"vite": "^5.4.8"
},
"type": "module",
"dependencies": {
"@fontsource-variable/nunito-sans": "^5.1.0",
"@shikijs/rehype": "^1.21.0",
"bits-ui": "^0.21.15",
"@shikijs/rehype": "^1.22.0",
"bits-ui": "^0.21.16",
"date-fns": "^4.1.0",
"gunzip-maybe": "^1.4.2",
"lucide-svelte": "^0.446.0",
@ -50,7 +50,7 @@
"remark-gfm": "^4.0.0",
"remark-parse": "^11.0.0",
"remark-rehype": "^11.1.1",
"shiki": "^1.21.0",
"shiki": "^1.22.0",
"tar-stream": "^3.1.7",
"unified": "^11.0.5"
}

View file

@ -41,9 +41,7 @@ export const load: PageLoad = async ({ parent, fetch }) => {
const { pkg } = await parent()
const { name, version, targets } = pkg
console.log("fetching readme")
const readmeText = await fetchReadme(fetch, name, version, targets[0].kind)
console.log(readmeText)
const file = await unified()
.use(remarkParse)
@ -52,20 +50,20 @@ export const load: PageLoad = async ({ parent, fetch }) => {
.use(remarkRehype, { allowDangerousHtml: true })
.use(rehypeRaw)
.use(rehypeSanitize)
// .use(rehypeShiki, {
// theme: createCssVariablesTheme({
// name: "css-variables",
// variablePrefix: "--shiki-",
// variableDefaults: {},
// fontStyle: true,
// }),
// fallbackLanguage: "text",
// })
.use(rehypeShiki, {
theme: createCssVariablesTheme({
name: "css-variables",
variablePrefix: "--shiki-",
variableDefaults: {},
fontStyle: true,
}),
lazy: true,
fallbackLanguage: "text",
})
.use(rehypeStringify)
.process(readmeText)
const readmeHtml = file.value
console.log(readmeHtml)
return {
readmeHtml,