reactivity lost in external components
Vue version
3.2.25
Link to minimal reproduction
https://github.com/mu-yu/vue-lerna-issue/tree/master
Steps to reproduce
- clone the project and install lerna@4.0.0
- run
lerna bootstrap && lerna link
to install all dependencies - run
lerna run build
to build all packages - cd to
packages/dashbaord/dist
and runnpx serve
to serve the dashboard - open
http://localhost:3000
in browser and click the count button, the count will NOT be updated in view. - 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?
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
Vue2 works fine as expected, vue3 with dev mode works fine, too.
This issue is only occured in vue3 after build.
Your build process includes two copies of vue, from the two packages' node_modules https://vitejs.dev/config/shared-options.html#resolve-dedupe