Subscribe on changes!

reactivity lost in external components

avatar
Oct 13th 2023

Vue version

3.2.25

Link to minimal reproduction

https://github.com/mu-yu/vue-lerna-issue/tree/master

Steps to reproduce

  1. clone the project and install lerna@4.0.0
  2. run lerna bootstrap && lerna link to install all dependencies
  3. run lerna run build to build all packages
  4. cd to packages/dashbaord/dist and run npx serve to serve the dashboard
  5. open http://localhost:3000 in browser and click the count button, the count will NOT be updated in view.
  6. click the update prop button will update the count in view.

What is expected?

ref/reactive don't lose reactity and render correct.

What is actually happening?

issue

As the gif shows, the count ref lost reactivity and doesn't update in view.

System Info

System:
    OS: Windows 10 10.0.22623
    CPU: (12) x64 Intel(R) Core(TM) i5-10500 CPU @ 3.10GHz
    Memory: 8.88 GB / 31.79 GB
  Binaries:
    Node: 18.17.0 - ~\AppData\Local\Volta\tools\image\node\18.17.0\node.EXE
    npm: 9.6.7 - ~\AppData\Local\Volta\tools\image\node\18.17.0\npm.CMD
    pnpm: 8.9.0 - ~\AppData\Local\Volta\bin\pnpm.EXE
  Browsers:
    Edge: Spartan (44.22621.1095.0), Chromium (117.0.2045.47)
    Internet Explorer: 11.0.22621.1

Any additional comments?

No response

avatar
Oct 13th 2023

Vue2 works fine as expected, vue3 with dev mode works fine, too.

This issue is only occured in vue3 after build.

avatar
Oct 13th 2023

Your build process includes two copies of vue, from the two packages' node_modules https://vitejs.dev/config/shared-options.html#resolve-dedupe