docus icon indicating copy to clipboard operation
docus copied to clipboard

shiki highlighter not working for non-default languages causes 404

Open PGimenez opened this issue 2 years ago • 3 comments

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.

PGimenez avatar Sep 27 '23 20:09 PGimenez

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 :|

McSneaky avatar Sep 29 '23 21:09 McSneaky

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>

PGimenez avatar Sep 30 '23 10:09 PGimenez

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

ariesmaulana avatar Sep 30 '23 15:09 ariesmaulana