Skip to content

Conversation

@dwjohnston
Copy link
Owner

@dwjohnston dwjohnston commented Sep 26, 2025

Fix syntax highlighting issue by auto detecting language based on file extension.

This is a somewhat naive approach, but works for now.

Also, have switched to Prism of HLJS as Prism supports TSX, JSX.

Worth considering approaches mentioned in this thread for more comprehensive language detection.

PrismJS/prism#1313

@changeset-bot
Copy link

changeset-bot bot commented Sep 26, 2025

🦋 Changeset detected

Latest commit: e29b46b

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
react-github-permalink Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@netlify
Copy link

netlify bot commented Sep 26, 2025

Deploy Preview for react-github-permalink ready!

Name Link
🔨 Latest commit 13c6ac3
🔍 Latest deploy log https://app.netlify.com/projects/react-github-permalink/deploys/68d5f3051103ad000860f369
😎 Deploy Preview https://deploy-preview-73--react-github-permalink.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 project configuration.

Fix syntax highlighting for React/TypeScript files by adding language detection

Co-authored-by: dwjohnston <[email protected]>

Add React TSX syntax highlighting demo story and verify fix works

Co-authored-by: dwjohnston <[email protected]>

Sample tsx

Just don't set the language

Get rid of 'getLanguageFromPath' stuff
@dwjohnston dwjohnston force-pushed the human/fix-53-syntax-highlighting branch from 3355328 to e53808d Compare September 26, 2025 01:59
@netlify
Copy link

netlify bot commented Sep 26, 2025

Deploy Preview for react-github-permalink ready!

Name Link
🔨 Latest commit e29b46b
🔍 Latest deploy log https://app.netlify.com/projects/react-github-permalink/deploys/68d6169fb8a9bc0008951bb9
😎 Deploy Preview https://deploy-preview-73--react-github-permalink.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 project configuration.

@dwjohnston dwjohnston force-pushed the human/fix-53-syntax-highlighting branch from 7337d25 to 48dfb21 Compare September 26, 2025 04:25
@dwjohnston dwjohnston changed the title Fix syntax highlighting issue by not specifying the language. Fix syntax highlighting. Sep 26, 2025
@dwjohnston dwjohnston linked an issue Sep 26, 2025 that may be closed by this pull request
@dwjohnston dwjohnston merged commit afb27b2 into main Oct 6, 2025
5 checks passed
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

Successfully merging this pull request may close these issues.

React code is not rendering very nicely

2 participants