feat(plugin-shiki): add built-in twoslash support

[Mister-Hope]

No description provided.

[netlify]

✅ Deploy Preview for vuepress-ecosystem ready!

Name	Link
🔨 Latest commit	bb50152
🔍 Latest deploy log	https://app.netlify.com/sites/vuepress-ecosystem/deploys/6793b03ce6a3a50008c2312f
😎 Deploy Preview	https://deploy-preview-348--vuepress-ecosystem.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[netlify]

✅ Deploy Preview for vuepress-ecosystem ready!

Name	Link
🔨 Latest commit	846eac7
🔍 Latest deploy log	https://app.netlify.com/sites/vuepress-ecosystem/deploys/67a9d1f54cc5860008675106
😎 Deploy Preview	https://deploy-preview-348--vuepress-ecosystem.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[Mister-Hope]

@pengzhanbo It seems that you already implement a good approach in your theme, please consider migrating the feature upstream.

[coveralls]

Pull Request Test Coverage Report for Build 13238502702

Warning: This coverage report may be inaccurate.

This pull request's base commit is no longer the HEAD commit of its target branch. This means it includes changes from outside the original pull request, including, potentially, unrelated coverage changes.

• For more information on this, see Tracking coverage changes with pull request builds.
• To avoid this issue with future PRs, see these Recommended CI Configurations.
• For a quick fix, rebase this PR at GitHub. Your next report should be accurate.

Details

• 4 of 6 (66.67%) changed or added relevant lines in 2 files are covered.
• No unchanged relevant lines lost coverage.
• Overall coverage decreased (-0.03%) to 59.656%

---

Changes Missing Coverage	Covered Lines	Changed/Added Lines	%
plugins/markdown/plugin-shiki/src/node/markdown/highlighter/createShikiHighlighter.ts	3	5	60.0%

Totals
Change from base Build 12964973105:	-0.03%
Covered Lines:	1349
Relevant Lines:	2044

---

💛 - Coveralls

[pengzhanbo]

I see that the current PR uses renderRich as the rendering solution for twoslash.

In the early stages of my theme, I also used renderRich, but the experience was not user-friendly. It was limited by the code block's overflow: auto setting; if the popup inside the code block was too large and exceeded the width or height of the code block, the popup would be partially obscured, and the code block would display a scrollbar.

I suggest using RenderFloatingVue as the rendering mode, which would provide a much better experience. Of course, this would require introducing more third-party dependencies like floating-vue, mdast-util-from-markdown, mdast-util-gfm, and mdast-util-to-hast.

If twoslash is to be integrated into plugin-shiki, having users manually install these dependencies related to twoslash would raise the barrier to usage. Should we consider making them default installed dependencies? Do you have any solutions regarding this?

[Mister-Hope]

I would prefer optional deps plan, and if the deps are too many, we can consider providing an extra package which has them as deps, so that users can install a single package (e.g.: @vuepress/shiki-twoslash) to achieve