vitejs / vite

Next generation frontend tooling. It's fast!
http://vitejs.dev
MIT License
67.18k stars 6.04k forks source link

HMR won't work on vue files if import other packages which are in the same monorepo #17532

Closed niuiic closed 2 months ago

niuiic commented 2 months ago

Describe the bug

Edit a file in a package of a monorepo. No HMR, no reload, but vite log shows that the module has been updated.

Reproduction

https://github.com/niuiic/vue-fusion

Steps to reproduce

git clone https://github.com/niuiic/vue-fusion -b dev
pnpm i
pnpm build
cd packages/styles
pnpm dev

Edit packages/styles/src/App.vue, just add a console.log('hello') in script.

No reload, no HMR.

However HMR works when change code in <style>.

In addition, If I remove some code in App.vue and main.ts, HMR would be able to work, but not always.

In another similar project (almost the same, but not a monorepo).

git clone https://github.com/niuiic/vue-resource
pnpm i
pnpm dev

Edit src/App.vue.

HMR works.

System Info

System:
    OS: Linux 6.9 Arch Linux
    CPU: (16) x64 AMD Ryzen 7 5800H with Radeon Graphics
    Memory: 8.60 GB / 15.58 GB
    Container: Yes
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.2.0 - /run/user/1000/fnm_multishells/19365_1718856780871/bin/node
    Yarn: 1.22.22 - /usr/bin/yarn
    npm: 10.7.0 - /run/user/1000/fnm_multishells/19365_1718856780871/bin/npm
    pnpm: 9.4.0 - /run/user/1000/fnm_multishells/19365_1718856780871/bin/pnpm

Used Package Manager

pnpm

Logs

vue-fusion styles ```shell vite:hmr [file change] src/App.vue +40s 12:04:16 PM [vite] hmr update /src/App.vue vite:load 0.92ms [fs] /src/App.vue +40s vite:cache [memory] /src/utils/code/index.ts +40s vite:cache [memory] /node_modules/.vite/deps/vue.js?v=acf679e9 +1ms vite:cache [memory] /node_modules/.vite/deps/element-plus_es_locale_lang_zh-cn.js?v=83fa67f3 +0ms vite:cache [memory] plugin-vue:export-helper +0ms vite:cache [memory] vite/dynamic-import-helper.js +0ms vite:hmr [self-accepts] src/App.vue +64ms vite:import-analysis 2.90ms [7 imports rewritten] src/App.vue +40s vite:transform 23.73ms /src/App.vue +40s vite:time 25.52ms /src/App.vue +40s vite:load 1.50ms [plugin] /src/App.vue?vue&type=style&index=0&scoped=7a7a37b1&lang.scss +25ms vite:hmr [self-accepts] src/App.vue?vue&type=style&index=0&scoped=7a7a37b1&lang.scss +24ms vite:import-analysis 0.30ms [0 imports rewritten] src/App.vue?vue&type=style&index=0&scoped=7a7a37b1&lang.scss +25ms vite:transform 23.41ms /src/App.vue?vue&type=style&index=0&scoped=7a7a37b1&lang.scss +25ms ```
vue-resources ```shell vite:hmr [file change] src/App.vue +9s 12:01:44 PM [vite] hmr update /src/App.vue (x3) vite:load 1.27ms [fs] /src/App.vue +9s vite:cache [memory] /src/utils/code/index.ts +9s vite:cache [memory] /node_modules/.vite/deps/vue.js?v=bb7042f4 +0ms vite:cache [memory] plugin-vue:export-helper +0ms vite:cache [memory] vite/dynamic-import-helper.js +0ms vite:hmr [self-accepts] src/App.vue +32ms vite:import-analysis 1.47ms [8 imports rewritten] src/App.vue +9s vite:transform 18.01ms /src/App.vue +9s vite:time 20.12ms /src/App.vue +9s vite:load 0.98ms [plugin] /src/App.vue?vue&type=style&index=0&scoped=7a7a37b1&lang.scss +19ms vite:hmr [self-accepts] src/App.vue?vue&type=style&index=0&scoped=7a7a37b1&lang.scss +19ms vite:import-analysis 0.38ms [0 imports rewritten] src/App.vue?vue&type=style&index=0&scoped=7a7a37b1&lang.scss +19ms vite:transform 18.03ms /src/App.vue?vue&type=style&index=0&scoped=7a7a37b1&lang.scss +19ms ```

Validations

niuiic commented 2 months ago

In packages/styles/src/utils/code/Code.vue, I import something from packages/buintins. Then hmr does not work for all vue files in packages/styles.

But import these in a ts file would not affect hmr feature.