question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Markdown with Vue components in list item does not render link

See original GitHub issue

Describe the bug

When using a Vue component followed by a markdown link in a list item, the link is not rendered correctly. This worked with https://github.com/antfu/vite-plugin-md (Slidev v0.33.0 and before) For example: * <Counter /> [Example link](https://github.com/).

Related: https://github.com/slidevjs/slidev/issues/658

Manual reproduction:

  1. Add * <Counter /> [Test Link](https://github.com/) as last line in index.md in the examples folder. image

Reproduction

https://stackblitz.com/edit/slidev-nxyjmy?file=slides.md

System Info

System:
    OS: macOS 12.4
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 124.64 MB / 32.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.14.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 8.12.1 - ~/.npm/bin/npm
  Browsers:
    Brave Browser: 102.1.39.120
    Chrome: 103.0.5060.114
    Firefox: 84.0.1
    Firefox Developer Edition: 102.0
    Safari: 15.5
    Safari Technology Preview: 16.0

Used Package Manager

yarn

Validations

  • Follow our Code of Conduct
  • Read the Contributing Guide.
  • Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
  • Check that this is a concrete bug. For Q&A, please open a GitHub Discussion instead.
  • The provided reproduction is a minimal reproducible of the bug.

Issue Analytics

  • State:closed
  • Created a year ago
  • Reactions:1
  • Comments:11 (8 by maintainers)

github_iconTop GitHub Comments

1reaction
meteorlxycommented, Jul 22, 2022

@manniL Good news, I think I made it at least for this case 😃

1reaction
meteorlxycommented, Jul 22, 2022

There could be a solution for that, but in fact I’m also not an expert of the markdown-it parsing flow so I didn’t solve it yet 😢 .

Read more comments on GitHub >

github_iconTop Results From Across the Web

Vue components in user-defined markdown - Stack Overflow
I need to instantiate zero or more Vue components within HTML generated by a markdown rendering plugin. The component count and props for ......
Read more >
Rendering Markdown inside components · Issue #257 - GitHub
The use case is to render C#, JS, XML and PowerShell source code within a custom Vue component. The source code is not...
Read more >
Build A Vue.js Markdown Renderer Component
It should also display images from url links ![ ... As we can see marked.js does not highlight code by default but searching...
Read more >
Markdown Extensions | VuePress
VuePress supports redirecting to clean links. If a link /foo is not found, VuePress will look for a existing /foo/ or /foo.html ....
Read more >
Markdown - VuePress 2
Non-standard HTML tags would not be recognized as native HTML tags by Vue template compiler. Instead, Vue will try to resolve those tags...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found