From 9b6c662501db4290eaccf79fe906bb4aa8b28641 Mon Sep 17 00:00:00 2001 From: Anthony Fu Date: Sun, 13 Nov 2022 08:54:58 +0800 Subject: [PATCH 1/3] fix(pages): improve HMR for macros, close #8820 --- packages/nuxt/src/pages/page-meta.ts | 30 +++++++++++++++++++++++++--- 1 file changed, 27 insertions(+), 3 deletions(-) diff --git a/packages/nuxt/src/pages/page-meta.ts b/packages/nuxt/src/pages/page-meta.ts index bb53f1bf503..f94db0776c4 100644 --- a/packages/nuxt/src/pages/page-meta.ts +++ b/packages/nuxt/src/pages/page-meta.ts @@ -13,6 +13,18 @@ export interface PageMetaPluginOptions { sourcemap?: boolean } +const CODE_EMPTY = ` +const __nuxt_page_meta = {} +export default __nuxt_page_meta +` + +const CODE_HMR = ` +if (import.meta.hot) { + import.meta.hot.accept(mod => { + Object.assign(__nuxt_page_meta, mod) + }) +}` + export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) => { return { name: 'nuxt:pages-macros-transform', @@ -88,7 +100,7 @@ export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) => } if (!hasMacro && !code.includes('export { default }') && !code.includes('__nuxt_page_meta')) { - s.overwrite(0, code.length, 'export default {}') + s.overwrite(0, code.length, CODE_EMPTY + CODE_HMR) return result() } @@ -117,7 +129,7 @@ export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) => const meta = node.arguments[0] as Expression & { start: number, end: number } - let contents = `const __nuxt_page_meta = ${code!.slice(meta.start, meta.end) || '{}'}\nexport default __nuxt_page_meta` + let contents = `const __nuxt_page_meta = ${code!.slice(meta.start, meta.end) || '{}'}\nexport default __nuxt_page_meta` + CODE_HMR function addImport (name: string | false) { if (name && importMap.has(name)) { @@ -147,10 +159,22 @@ export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) => }) if (!s.hasChanged() && !code.includes('__nuxt_page_meta')) { - s.overwrite(0, code.length, 'export default {}') + s.overwrite(0, code.length, CODE_EMPTY + CODE_HMR) } return result() + }, + vite: { + handleHotUpdate: { + order: 'pre', + handler: ({ modules }) => { + // Remove macro file from modules list to prevent HMR overrides + const index = modules.findIndex(i => i.id?.includes('?macro=true')) + if (index !== -1) { + modules.splice(index, 1) + } + } + } } } }) From f7f0a95cb207c540b46b7c27f7721ccb48c7f4d4 Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Tue, 15 Nov 2022 09:58:00 +0000 Subject: [PATCH 2/3] feat: add webpack support --- packages/nuxt/src/pages/page-meta.ts | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/packages/nuxt/src/pages/page-meta.ts b/packages/nuxt/src/pages/page-meta.ts index f94db0776c4..8296e4e158e 100644 --- a/packages/nuxt/src/pages/page-meta.ts +++ b/packages/nuxt/src/pages/page-meta.ts @@ -19,10 +19,19 @@ export default __nuxt_page_meta ` const CODE_HMR = ` -if (import.meta.hot) { - import.meta.hot.accept(mod => { - Object.assign(__nuxt_page_meta, mod) - }) +if (process.dev) { + // Vite + if (import.meta.hot) { + import.meta.hot.accept(mod => { + Object.assign(__nuxt_page_meta, mod) + }) + } + // Webpack + if (import.meta.webpackHot) { + import.meta.webpackHot.accept((err) => { + if (err) { window.location = window.location.href } + }) + } }` export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) => { From 152cfe47596366bc50ffada3291b5a6aaa33eb73 Mon Sep 17 00:00:00 2001 From: Daniel Roe Date: Tue, 15 Nov 2022 10:40:43 +0000 Subject: [PATCH 3/3] fix: use `dev` option to treeshake hmr code --- packages/nuxt/src/pages/page-meta.ts | 30 +++++++++++++--------------- 1 file changed, 14 insertions(+), 16 deletions(-) diff --git a/packages/nuxt/src/pages/page-meta.ts b/packages/nuxt/src/pages/page-meta.ts index 8296e4e158e..c95d2afdc7f 100644 --- a/packages/nuxt/src/pages/page-meta.ts +++ b/packages/nuxt/src/pages/page-meta.ts @@ -19,19 +19,17 @@ export default __nuxt_page_meta ` const CODE_HMR = ` -if (process.dev) { - // Vite - if (import.meta.hot) { - import.meta.hot.accept(mod => { - Object.assign(__nuxt_page_meta, mod) - }) - } - // Webpack - if (import.meta.webpackHot) { - import.meta.webpackHot.accept((err) => { - if (err) { window.location = window.location.href } - }) - } +// Vite +if (import.meta.hot) { + import.meta.hot.accept(mod => { + Object.assign(__nuxt_page_meta, mod) + }) +} +// Webpack +if (import.meta.webpackHot) { + import.meta.webpackHot.accept((err) => { + if (err) { window.location = window.location.href } + }) }` export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) => { @@ -109,7 +107,7 @@ export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) => } if (!hasMacro && !code.includes('export { default }') && !code.includes('__nuxt_page_meta')) { - s.overwrite(0, code.length, CODE_EMPTY + CODE_HMR) + s.overwrite(0, code.length, CODE_EMPTY + (options.dev ? CODE_HMR : '')) return result() } @@ -138,7 +136,7 @@ export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) => const meta = node.arguments[0] as Expression & { start: number, end: number } - let contents = `const __nuxt_page_meta = ${code!.slice(meta.start, meta.end) || '{}'}\nexport default __nuxt_page_meta` + CODE_HMR + let contents = `const __nuxt_page_meta = ${code!.slice(meta.start, meta.end) || '{}'}\nexport default __nuxt_page_meta` + (options.dev ? CODE_HMR : '') function addImport (name: string | false) { if (name && importMap.has(name)) { @@ -168,7 +166,7 @@ export const PageMetaPlugin = createUnplugin((options: PageMetaPluginOptions) => }) if (!s.hasChanged() && !code.includes('__nuxt_page_meta')) { - s.overwrite(0, code.length, CODE_EMPTY + CODE_HMR) + s.overwrite(0, code.length, CODE_EMPTY + (options.dev ? CODE_HMR : '')) } return result()