VuePress 2 support in plugin

[KnorpelSenf]

I'd love to use this project with the upcoming VuePress 2 release that is currently in beta.

Are there any plans to support it?

[frencojobs]

Won't the current Vuepress plugin work? Even if that's the case, since Vuepress 2 still uses Markdown-It, you can create a local plugin file and use the Markdown-It plugin as shown here.

[KnorpelSenf]

That's what I have tried to do, but trying to import markdown-it-shiki-twoslash from the .config.ts file in VuePress will cause module resolution errors. require() of ES modules is not supported. is thrown from markdown-it-shiki-twoslash. I am not sure if it relates to the deasync stuff and it looks like a pretty deep rabbit hole, so I opened this issue before investigating further.

I pushed a branch to my project which reproduces the error. Could you take a look? I hope I'm not missing something obvious.

git clone [email protected]:grammyjs/website.git twoslash-issue-107
cd twoslash-issue-107/site
git checkout shiki-support
npm install
npm run docs:dev

The error is thrown when importing markdown-it-shiki-twoslash from here https://github.com/grammyjs/website/blob/shiki-support/site/docs/.vuepress/config.ts#L315-L318

[ap0nia]

That's what I have tried to do, but trying to import markdown-it-shiki-twoslash from the .config.ts file in VuePress will cause module resolution errors. require() of ES modules is not supported. is thrown from markdown-it-shiki-twoslash. I am not sure if it relates to the deasync stuff and it looks like a pretty deep rabbit hole, so I opened this issue before investigating further.

I pushed a branch to my project which reproduces the error. Could you take a look? I hope I'm not missing something obvious.

git clone [email protected]:grammyjs/website.git twoslash-issue-107
cd twoslash-issue-107/site
git checkout shiki-support
npm install
npm run docs:dev

The error is thrown when importing markdown-it-shiki-twoslash from here https://github.com/grammyjs/website/blob/shiki-support/site/docs/.vuepress/config.ts#L315-L318

I'm also trying the same thing, and it seems to import without errors now (2023). However, the features don't seem to be working.

// vuepress.config.ts
import { defineUserConfig } from 'vuepress'
import { markdownItShikiTwoslashSetup } from 'markdown-it-shiki-twoslash'

export default defineUserConfig({
  async extendsMarkdown(extendable) {
    const shiki = await markdownItShikitTwoslashSetup({ theme: 'nord' })
    extendable.use(shiki)
  }
})

The following snippet (back ticks replaced with regular quotes):

'''ts twoslash
const hi = "HI"

// ---cut---
const msg = `${hi} world` as const
//    ^?
'''

renders this, which is absent of type information, diagnostics, two slash functionality, etc.