Vite + router + tailwind JIT -> full page reload #4150
Describe the bug
Follow up of #4147 , when editing Vue templates, I get full page reload instead of HMR.
Go into HelloWorld.vue, change the class
Notice on the terminal or in the browser that vite triggered a full page reload. I'd expect HMR here.
I first tried without Vue router and it worked, so I'm not sure where the problem lies exactly.
System: OS: Windows 10 10.0.18363 CPU: (12) x64 Intel(R) Core(TM) i7-9850H CPU @ 2.60GHz Memory: 5.05 GB / 15.79 GB Binaries: Node: 15.5.1 - C:\Program Files\nodejs\node.EXE Yarn: 1.22.10 - ~\AppData\Roaming\npm\yarn.CMD npm: 7.3.0 - C:\Program Files\nodejs\npm.CMD Browsers: Edge: Spartan (44.18362.1593.0) Internet Explorer: 11.0.18362.1 npmPackages: @vitejs/plugin-vue: ^1.2.2 => 1.2.4 vite: ^2.3.3 => 2.4.1
Used Package Manager
The text was updated successfully, but these errors were encountered:
Similar issue here, using
When saving a component, in almost all cases the CSS will not be updated. HTML is being updated with HMR, but CSS is not. Weirdly, in very few cases, CSS will be properly updated but I can't see a pattern that would explain why.
I have to go save
@OneNail I double-checked, and as can be shown in System info, npm restored vite 2.4.1 on my machine as it satisfies ^2.3.3.
I tried to revert 09c6c94 locally, hmr triggers on
HMR is broken with tailwindcss (jit mode) since 2.3.7 (component simply won't update).
This is the object received by
I'm not sure why
IIUC, tailwind tells postcss to register all the purgeable files as a dependencies and so this is being called :
This precise case could be fixed by importing
I'm laking a bit of context here to go forward with a fix.
Edit 4 :
Overall it seems that the issue is that Tailwind (JIT) generated css (
So it seems that the moduleGraph contains 2 entries for the SFC being updated :
Ultimately a force page reload is invoked according to this code :
My guess is the original issue lies somewhere where the SFC module is registered twice with different URL and differents importers (absolute with
Same issue here with
And additional observation: When you enable
This is further confirmation for #4267, because the order in which modules are emcountered can mask tge bug. @lhermann Could you try to yarn link vite with this PR to check that the issue is resolved for you?