Skip to content

fix(theme): highlight the <PackageManagerTabs /> manually#2153

Merged
SoonIter merged 2 commits intomainfrom
syt/shiki-package-managers
May 13, 2025
Merged

fix(theme): highlight the <PackageManagerTabs /> manually#2153
SoonIter merged 2 commits intomainfrom
syt/shiki-package-managers

Conversation

@SoonIter
Copy link
Copy Markdown
Member

Summary

in Rspress v2 we enable shiki by default to highlight languages in compile process, and code blocks in dynamic components can not be highlighted yet. We plan to provide a <CodeBlockRuntime /> component to resolve this issue, tracking in #2126.

<CodeBlockRuntime /> means that we imports the whole shiki in runtime, but the cost is indeed too high.

So we parse it in runtime manually to support shiki highlight

before

image

after

image

Related Issue

Checklist

  • Tests updated (or not required).
  • Documentation updated (or not required).

@netlify
Copy link
Copy Markdown

netlify bot commented May 13, 2025

Deploy Preview for rspress ready!

Name Link
🔨 Latest commit 9044640
🔍 Latest deploy log https://app.netlify.com/sites/rspress/deploys/6823347cd948fd0008c53a00
😎 Deploy Preview https://deploy-preview-2153--rspress.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
Lighthouse
Lighthouse
1 paths audited
Performance: 87 (🔴 down 6 from production)
Accessibility: 97 (no change from production)
Best Practices: 92 (🟢 up 9 from production)
SEO: 100 (no change from production)
PWA: -
View the detailed breakdown and full score reports

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

@netlify
Copy link
Copy Markdown

netlify bot commented May 13, 2025

Deploy Preview for rspress-v2 ready!

Name Link
🔨 Latest commit 9044640
🔍 Latest deploy log https://app.netlify.com/sites/rspress-v2/deploys/6823347cffd0290008ba7fd1
😎 Deploy Preview https://deploy-preview-2153--rspress-v2.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

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

@SoonIter SoonIter changed the title fix(theme): highlight the PackageManager manually fix(theme): highlight the <PackageManagerTabs /> manually May 13, 2025
@SoonIter SoonIter requested a review from Timeless0911 May 13, 2025 12:17
@SoonIter SoonIter enabled auto-merge (squash) May 13, 2025 12:17
@SoonIter SoonIter merged commit 0c3285e into main May 13, 2025
12 checks passed
@SoonIter SoonIter deleted the syt/shiki-package-managers branch May 13, 2025 12:34
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants