shiki highlighter not working for non-default languages causes 404
If I try to highlight a language other than the default like html or js, the site stops working and it can't be built. The browser shows a 404:
{
"statusCode": 404,
"statusMessage": "Cannot find any path matching /.",
"stack": []
}
To attempt to debug this, I've started a docus project from scratch with npx nuxi@latest init docs -t themes/docus and added a snippet to the index page
```julia
if end
```
```rust
if end
```
This is my nuxt.config.ts:
export default defineNuxtConfig({
// https://github.com/nuxt-themes/docus
extends: '@nuxt-themes/docus',
devtools: { enabled: true },
content: {
highlight: {
theme: {
dark: "github-dark",
default: "github-light",
},
preload: ["julia", "rust"],
},
},
modules: [
// Remove it if you don't use Plausible analytics
// https://github.com/nuxt-modules/plausible
'@nuxtjs/plausible'
]
})
And this is the error I'm getting when npm run dev
[nuxt] [request error] [unhandled] [500] No grammar provided for <source.rust>
at a (./node_modules/shikiji/dist/core.mjs:434:15520)
at t.ScopeDependencyProcessor.processQueue (./node_modules/shikiji/dist/core.mjs:434:17212)
at Registry._loadGrammar (./node_modules/shikiji/dist/core.mjs:434:30884)
at async Registry.loadLanguage (./node_modules/shikiji/dist/core.mjs:549:15)
at async Registry.loadLanguages (./node_modules/shikiji/dist/core.mjs:573:7)
at async Object.loadLanguage (./node_modules/shikiji/dist/core.mjs:682:5)
at Object.getHighlightedAST (./node_modules/@nuxtjs/mdc/dist/runtime/shiki/highlighter.mjs:44:7)
at <anonymous> (./node_modules/@nuxtjs/mdc/dist/runtime/shiki/event-handler.mjs:16:12)
at async Object.handler (./node_modules/h3/dist/index.mjs:1630:19)
at async toNodeHandle (./node_modules/h3/dist/index.mjs:1840:7)
[nitro] [unhandledRejection] FetchError: [GET] "/api/_mdc/highlight?code=if+end%0A&lang=rust&theme=%7B%22default%22:%22github-light%22,%22dark%22:%22github-dark%22%7D&highlights=%5B%5D": 500
at runNextTicks (node:internal/process/task_queues:60:5)
at process.processImmediate (node:internal/timers:449:9)
at async $fetchRaw2 (file:///Users/pere/genie/docs/docs/node_modules/ofetch/dist/shared/ofetch.00501375.mjs:256:14)
at async $fetch2 (file:///Users/pere/genie/docs/docs/node_modules/ofetch/dist/shared/ofetch.00501375.mjs:261:15)
at async Promise.all (index 1)
at <anonymous> (/Users/pere/genie/docs/docs/node_modules/@nuxtjs/mdc/dist/runtime/parser/shiki.mjs:50:7)
It seems that the error is related to grammar files, but I don't know how to fix it. I've tried downgrading to earlier shiki versions but that didn't fix it.
Run into same issue. Decided to just drop syntax highlight
Wasted already whole week trying to get company docs up and running again, coz of different Nuxt and Docus bugs :|
I ended up switching to highlightjs. I tried following the markdown highlighter instructions but couldn't make it work, so I ended up modifying the default template to call highlightjs after the page is loaded.
<script lang="ts" setup>
import { onMounted } from 'vue';
import hljs from 'highlight.js'; // Import highlight.js if needed
onMounted(() => {
console.log("mounted")
document.querySelectorAll('pre code').forEach((block) => {
hljs.highlightBlock(block);
});
});
</script>
<template>
<DocsPageLayout>
<slot />
</DocsPageLayout>
</template>
<style>
.hljs {
width: 100%
}
</style>
I got a similar issue, after upgrading docus theme to (v1.14.9) it fix the issue
return
at Object.getHighlightedAST (./node_modules/@nuxtjs/mdc/dist/runtime/shiki/highlighter.mjs:44:7)
at <anonymous> (./node_modules/@nuxtjs/mdc/dist/runtime/shiki/event-handler.mjs:16:12)
at async Object.handler (./node_modules/h3/dist/index.mjs:1630:19)
at async toNodeHandle (./node_modules/h3/dist/index.mjs:1840:7)
[nuxt] [request error] [unhandled] [500] No grammar provided for <source.python>
after upgrade, no more issue