From aed4621b4b4427e37385a4d8645c5a1f1cb361fb Mon Sep 17 00:00:00 2001 From: Razvan Stoenescu Date: Thu, 4 Nov 2021 14:55:54 +0200 Subject: [PATCH] fix: HMR not working correctly with vue-class-component components vue-loader not registering "__hmrId" on the correct component property when component is created with vue-class-component. This leads to vue/compiler-sfc/runtime-core/src/render.ts mountComponent() function to not call registerHMR() on the instance (because __hmrId is not attached properly): if (__DEV__ && instance.type.__hmrId) { registerHMR(instance) } Not registering for HMR means the createRecord() map will never get injected any component instances, so when module.hot.accept() + api.rerender(id, render) are called they will not apply any update due to finding no instances: module.hot.accept("./Index.vue?vue&type=template&id=4bc9d7de&ts=true", () => { console.log('re-render') api.rerender('4bc9d7de', render) // will never do anything; instances === [] }) This commit fixes the exportComponent from src/exportHelper.ts by injecting the properties (__file and later down the road __hmrId) to the correct component prop: import exportComponent from ".......-loader/dist/exportHelper.js" const __exports__ = /*#__PURE__*/exportComponent(script, [['render',render],['__file',"src/pages/Index.vue"]]) // ... /* hot reload */ if (module.hot) { __exports__.__hmrId = "4bc9d7de" // we now have the correct __exports__ --- src/exportHelper.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/exportHelper.ts b/src/exportHelper.ts index ebf27a3c4..9f98b41e5 100644 --- a/src/exportHelper.ts +++ b/src/exportHelper.ts @@ -1,8 +1,9 @@ // runtime helper for setting properties on components // in a tree-shakable way export default (sfc: any, props: [string, string][]) => { + const target = sfc.__vccOpts || sfc for (const [key, val] of props) { - sfc[key] = val + target[key] = val } - return sfc + return target } pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy