Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

shiki highlighter not working for non-default languages causes 404 #983

Open
PGimenez opened this issue Sep 27, 2023 · 3 comments
Open

shiki highlighter not working for non-default languages causes 404 #983

PGimenez opened this issue Sep 27, 2023 · 3 comments

Comments

@PGimenez
Copy link

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 PGimenez changed the title shiki highlighter not working for non-default languages shiki highlighter not working for non-default languages causes 404 Sep 27, 2023
@McSneaky
Copy link

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

@PGimenez
Copy link
Author

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>

@ariesmaulana
Copy link

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants