vuejs / vitepress

Vite & Vue powered static site generator.
https://vitepress.dev
MIT License
11.47k stars 1.86k forks source link

HMR not working on import code snippets #117

Closed yuxino closed 7 months ago

yuxino commented 3 years ago

Describe the bug

HMR not working on import code snippets

To Reproduce

Steps to reproduce the behavior:

see this video

Expected behavior

auto update code

System Info

kiaking commented 3 years ago

@yuxino Hi! I can't even make code snippet import to work in the first place 😅 Your reproduction repo is 404, could you fix that?

yuxino commented 3 years ago

@kiaking my bad ,now repo is public

kiaking commented 3 years ago

OK thanks! I've confirmed it. I'm not sure if this feature is fully supported yet... 😅 Let's mark this issue as an enhancement and see if we can make it work.

lovetingyuan commented 2 years ago

any update on this feature?

brc-dd commented 1 year ago

Let's track this at #444. Fixing that would fix this too.

brc-dd commented 1 year ago

Also not on imported markdown files. HMR is triggering for them, but we are using custom handleHotUpdate that's not able to handle the updates in that case.

brc-dd commented 1 year ago

https://github.com/vuejs/vitepress/compare/chore/vite-3...fix/hmr?expand=1 -- these changes seem to fix this. But I'm not sure if this is proper/elegant way to do stuff.

yl-199807 commented 1 year ago

I also met. Hope to be fixed. The same problem on vuepress is fixed. https://github.com/vuejs/vuepress/issues/1309 https://github.com/vuejs/vuepress/pull/1358

wycats commented 1 year ago

@brc-dd said:

chore?expand=1 (compare) -- these changes seem to fix this. But I'm not sure if this is proper/elegant way to do stuff.

This link isn't working (anymore?). What did your kludgy fix do?

brc-dd commented 1 year ago

Ah, that vite-3 branch was deleted after merging. That HMR branch is still there (outdated though). These were the changes I was referring to: https://github.com/vuejs/vitepress/commit/7dbceaa98d47e5d79e4d16924b149721363df532?w=1

wycats commented 1 year ago

Is there any more progress on this? I can see how to do it in a fork, but I'd rather not rely on code that will inevitably become stale.

If I'm thinking about this correctly, what we need is a way to augment the includes that are currently hardcoded to the @include syntax (the code already calls server.addWatchFile for all files that the markdown function returns as includes).

Adding a way to collect additional includes to the markdown-it env seems straightforward. If there's interest, I'd be happy to take a stab at a pull request that does that 😄

wycats commented 1 year ago

Ah, I can see that this problem exists even if an include is added. I was so focused on my use-case that I didn't notice that the HMR issue exists even if server.addWatchFile is used.

I still think that it would be good to let markdown plugins do custom includes, but perhaps the API needs to be rich enough to support HMR. If there's interest, I can dig into that 😄

brc-dd commented 9 months ago

The solution in #2581 seems to work for most cases, but one might also need to add some plugin like https://github.com/ElMassimo/vite-plugin-full-reload e.g. in cases where a vue component is both imported and included as code snippet.

brc-dd commented 7 months ago

Okay, so this should work fine without any extra config in next version. I went with a slightly modified approach of what I had earlier proposed in 7dbceaa