Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
7 tasks done
niuiic opened this issue Jun 20, 2024 · 1 comment
Closed
7 tasks done

Comments

@niuiic
Copy link

niuiic commented Jun 20, 2024

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
  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
 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 niuiic changed the title HMR failed in specifix situation HMR failed in specific situation Jun 20, 2024
@niuiic niuiic changed the title HMR failed in specific situation HMR won't work on vue files if import other packages in the monorepo Jun 20, 2024
@niuiic niuiic changed the title HMR won't work on vue files if import other packages in the monorepo HMR won't work on vue files if import other packages which are in the same monorepo Jun 20, 2024
@niuiic
Copy link
Author

niuiic commented Jun 20, 2024

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.

@niuiic niuiic closed this as completed Jun 23, 2024
@github-actions github-actions bot locked and limited conversation to collaborators Jul 8, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

1 participant