feat: replace links in markdown instead of via javascript by essenmitsosse · Pull Request #1339 · npmx-dev/npmx.dev

essenmitsosse · 2026-02-10T14:32:09Z

Currently all links in the readme are intercepted via JavaScript and if they go to npmjs.com redirected to npmx.dev. This has several problems, most of which stem from the fact, that the link in the URL is not the link we are going to.

This PR:

replaces the link in the generated HTML ~~and removes the JavaScript handler~~ (JavaScript handler is still needed for code copy button)
adds an indicator for external link (aligned with regular links)
aligns the link styling with regular links)

Good example readme: /package/is-odd

vercel · 2026-02-10T14:32:50Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview, Comment	Feb 10, 2026 5:04pm

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored	Preview	Feb 10, 2026 5:04pm
npmx-lunaria	Ignored		Feb 10, 2026 5:04pm

coderabbitai · 2026-02-10T14:34:21Z

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

@coderabbitai resume to resume automatic reviews.
@coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

▶️ Resume reviews
🔍 Trigger review

📝 Walkthrough

Walkthrough

Updated Readme.vue to ignore clicks with modifier keys or non-primary buttons, expanded anchor handling to treat both hash (#...) and leading-slash (/...) hrefs as in-page or internal routes routed via router.push, and removed previous npmjs-to-internal-route mapping. Styling for README links was migrated to Tailwind @apply utilities, added :focus-visible rules and an external-link indicator for target="_blank". On the server, server/utils/readme.ts gained a reserved-path list and a helper to identify redirectable npmjs.com URLs; URL resolution now returns pathname+query+hash for those npmjs URLs. Unit tests for npmjs URL redirection were added.

Possibly related PRs

fix: allow modifier keys for import links in package code #1309: Adds the same modifier-key/non-primary-button guard to link click handlers in a different component (Code/Viewer.vue).
feat: use native scroll anchoring #1209: Modifies Readme.vue anchor click handling and client-side navigation/scroll behaviour, overlapping router-related logic changes.
fix: surfacing 429s as not found to users #1200: Adjusts link styling and focus-visible states across components, likely related to the Tailwind-based link style migration.

Suggested labels

idea

Suggested reviewers

danielroe

🚥 Pre-merge checks | ✅ 1

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description check	✅ Passed	The pull request description clearly explains the problem (links intercepted via JavaScript with URL mismatch issues) and describes the three main changes being implemented (link replacement in HTML, external link indicator, and link styling alignment).

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing touches

🧪 Generate unit tests (beta)

Create PR with unit tests
Post copyable unit tests in a comment

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

codecov · 2026-02-10T14:35:54Z

Codecov Report

❌ Patch coverage is 0% with 4 lines in your changes missing coverage. Please review.
✅ All tests successful. No failed tests found.

Files with missing lines	Patch %	Lines
app/components/Readme.vue	0.00%	2 Missing and 2 partials ⚠️

📢 Thoughts on this report? Let us know!

coderabbitai

Actionable comments posted: 4

Ooopsie daisy

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

Co-authored-by: Alex Savelyev <91429106+alexdln@users.noreply.github.com>

one more

alexdln · 2026-02-10T15:43:48Z

@essenmitsosse Just remembered one more weird behavior with this "new tab" markers

alexdln · 2026-02-10T15:48:11Z

@essenmitsosse It seems that if you specify for after: display: inline and content: "__" it will work well, but it needs to be tested

essenmitsosse · 2026-02-10T15:56:54Z

@alexdln can't make it inline because, then the icon does not work. I don't think there is a robust solution that doesn't make the problem worse then it currently is.

alexdln · 2026-02-10T16:03:25Z

@essenmitsosse Have you checked by adding content: "__" (2x "_")?

alexdln · 2026-02-10T16:06:11Z

danielroe · 2026-02-10T16:07:20Z

the JS handler will still be needed for client-side navigation, which will be more performant, but you can update it to check if window.location is the same as the href origin.

essenmitsosse · 2026-02-10T16:16:53Z

the JS handler will still be needed for client-side navigation, which will be more performant, but you can update it to check if window.location is the same as the href origin.

@danielroe what do you mean by that? Why do we need a JS handler for client side navigation?

danielroe · 2026-02-10T16:19:00Z

because nuxt doesn't listen to clicks on <a> elements, only on <NuxtLink>. so even though you are replacing the href, these links will result in a full refresh of the page, with a full server round trip

essenmitsosse · 2026-02-10T16:24:22Z

@essenmitsosse Have you checked by adding content: "__" (2x "_")?

now it works, I don't know why
WHAT KIND OF SORCERY IS THIS???

essenmitsosse · 2026-02-10T16:24:53Z

because nuxt doesn't listen to clicks on <a> elements, only on <NuxtLink>. so even though you are replacing the href, these links will result in a full refresh of the page, with a full server round trip

Aw shucks!

Co-authored-by: Alex Savelyev <91429106+alexdln@users.noreply.github.com>

alexdln · 2026-02-10T16:27:27Z

No sorcery, just uno adds a mask with icon under the current container. And since you had an inline with no content, its width was 0. So you just needed to increase the width.

You can't use width for an inline, but you can use content that won't be visible and preferably won't interfere with the mask and not wrapping

essenmitsosse · 2026-02-10T16:32:17Z

No sorcery, just uno adds a mask with icon under the current container. And since you had an inline with no content, its width was 0. So you just needed to increase the width.
You can't use width for an inline, but you can use content that won't be visible and preferably won't interfere with the mask and not wrapping

If that is not sorcery, what is then. 😂 But glad it works!

Co-authored-by: Daniel Roe <daniel@roe.dev>

essenmitsosse · 2026-02-10T16:40:12Z

because nuxt doesn't listen to clicks on <a> elements, only on <NuxtLink>. so even though you are replacing the href, these links will result in a full refresh of the page, with a full server round trip

@danielroe ✅

I also added a check for modifier keys, so CTRL + click for new tab works as expected, which it didn't before.

Co-authored-by: Daniel Roe <daniel@roe.dev>

essenmitsosse added 3 commits February 10, 2026 15:29

feat: remove click hijacking from readme
c0d51ff

feat: add external link indicator to readme
df6ecb0

style: align readme links with regular links
81e13c0

feat: replace npmjs urls in readme with local
e30cb04

essenmitsosse force-pushed the replace-links-in-markdown-text branch from 0dc35ee to e30cb04Compare February 10, 2026 14:32

essenmitsosse changed the title ~~Replace links in markdown text~~feat: replace links in markdown instead of via javascriptFeb 10, 2026

vercelBotdeployed to Preview – npmx.dev February 10, 2026 14:35 View deployment

coderabbitaiBot reviewed Feb 10, 2026
View reviewed changes

Comment threadapp/components/Readme.vue
Comment threadserver/utils/readme.ts
Comment threadserver/utils/readme.ts Outdated
Comment threadserver/utils/readme.ts Outdated

revert: re-add copy button functionalit
4cf2843
Ooopsie daisy

vercelBotdeployed to Preview – npmx.dev February 10, 2026 14:42 View deployment

essenmitsosseand others added 4 commits February 10, 2026 15:44

fix: invalid html
8ebcbea
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>

fix: remove debug logging
8fdf339

fix: css syntax
3cf2405

fix: remove debug logging
e1cc821

vercelBotdeployed to Preview – npmx.dev February 10, 2026 14:47 View deployment

alexdln reviewed Feb 10, 2026
View reviewed changes

Comment threadserver/utils/readme.ts Outdated

essenmitsosseand others added 2 commits February 10, 2026 16:30

refactor: use css for external readme link
ddc09ed
Co-authored-by: Alex Savelyev <91429106+alexdln@users.noreply.github.com>

style: align external link icon
71df41c

vercelBotdeployed to Preview – npmx.dev February 10, 2026 15:34 View deployment

Merge branch 'main' into replace-links-in-markdown-text
276da0a

alexdln previously approved these changes Feb 10, 2026
View reviewed changes

vercelBotdeployed to Preview – npmx.dev February 10, 2026 15:37 View deployment

alexdln self-requested a review February 10, 2026 15:41

fix: line break before external link icon
495d99e
Co-authored-by: Alex Savelyev <91429106+alexdln@users.noreply.github.com>

vercelBotdeployed to Preview – npmx.dev February 10, 2026 16:29 View deployment

essenmitsosseand others added 2 commits February 10, 2026 17:37

fix: re-add link click handling to utilize Nuxt router
a06b42b
Co-authored-by: Daniel Roe <daniel@roe.dev>

fix: dont handle clicks when modifier key is pressed
5bbb94f

vercelBotdeployed to Preview – npmx.dev February 10, 2026 16:41 View deployment

danielroe reviewed Feb 10, 2026
View reviewed changes

Comment threadapp/components/Readme.vue Outdated

fix: use navigateTo instead of router.push
ff05c51
Co-authored-by: Daniel Roe <daniel@roe.dev>

vercelBotdeployed to Preview – npmx.dev February 10, 2026 16:58 View deployment

fix: remove unused
eada041

vercelBotdeployed to Preview – npmx.dev February 10, 2026 17:04 View deployment

danielroe approved these changes Feb 10, 2026
View reviewed changes

danielroe added this pull request to the merge queue Feb 10, 2026

Merged via the queue into npmx-dev:main with commit e782462Feb 10, 2026
17 checks passed

coderabbitaiBot mentioned this pull request Feb 11, 2026
fix: markdown html links #1389
Merged

This was referenced Feb 22, 2026
feat: rewrite npmjs.org links #1573
Merged
fix: remove icon in anchor links in text #1765
Merged

coderabbitaiBot mentioned this pull request Mar 2, 2026
fix: change readme md renderer behavior #1776
Merged

Uh oh!

Uh oh!

Conversation

essenmitsosse commented Feb 10, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

vercelBot commented Feb 10, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

coderabbitaiBot commented Feb 10, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviews paused

Walkthrough

Possibly related PRs

Suggested labels

Suggested reviewers

Uh oh!

codecovBot commented Feb 10, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

coderabbitaiBot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

alexdln commented Feb 10, 2026

Uh oh!

alexdln commented Feb 10, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

essenmitsosse commented Feb 10, 2026

Uh oh!

alexdln commented Feb 10, 2026

Uh oh!

alexdln commented Feb 10, 2026

Uh oh!

danielroe commented Feb 10, 2026• edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

essenmitsosse commented Feb 10, 2026

Uh oh!

danielroe commented Feb 10, 2026

Uh oh!

essenmitsosse commented Feb 10, 2026

Uh oh!

essenmitsosse commented Feb 10, 2026

Uh oh!

alexdln commented Feb 10, 2026

Uh oh!

essenmitsosse commented Feb 10, 2026

Uh oh!

essenmitsosse commented Feb 10, 2026

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

essenmitsosse commented Feb 10, 2026•
edited
Loading

vercelBot commented Feb 10, 2026•
edited
Loading

coderabbitaiBot commented Feb 10, 2026•
edited
Loading

codecovBot commented Feb 10, 2026•
edited
Loading

alexdln commented Feb 10, 2026•
edited
Loading

danielroe commented Feb 10, 2026•
edited
Loading