HMR stops if mixin is used
Version
3.2.0-beta.4
Reproduction link
https://github.com/PeterAlfredLee/vue3_hmr_stop
Steps to reproduce
- Visit http://localhost:8080/
- Check the console output
- Change the
console.log
value increated
ofsrc/App.vue
- Check the console output
- Remove the
app.mixin({})
insrc/main.js
- Check the console output
- Change the
console.log
value increated
ofsrc/App.vue
- Check the console output
What is expected?
HMR will work and the console log output could be auto updated
What is actually happening?
With the mixin called, the HMR stops and the console log is not auto updated
I found this issue in vue-i18n that reports HMR stops. After some investigation, I found this problem was caused by call of mixin in vue, and it's introduced in version 3.1.0-beta.7
.
I think the problem is caused by this :
resolved = {}
if (globalMixins.length) {
globalMixins.forEach(m =>
mergeOptions(resolved, m, optionMergeStrategies, true)
)
}
mergeOptions(resolved, base, optionMergeStrategies)
The resolved
was assigned with a new object and was mixined with globalMixins
and base
. Therefore the change of base
will not influence the actual working var resolved
.
I fixed this with simply some simple code change :
resolved = base
if (globalMixins.length) {
globalMixins.forEach(m =>
mergeOptions(resolved, m, optionMergeStrategies, true)
)
}
Hope this helps.