refactor(guards): warn once

diff --git a/__tests__/warnings.spec.ts b/__tests__/warnings.spec.ts
index 41e8eda8b75d603899b2d582c14d2d2b88393717..e749472b741ea52171fa675600980caad4382dbb 100644 (file)
--- a/__tests__/warnings.spec.ts
+++ b/__tests__/warnings.spec.ts
@@ -194,9 +194,31 @@ describe('warnings', () => {
       ],
     })
     await router.push('/foo')
-    expect(
-      `Component "default" in record with path "/foo" is defined using "defineAsyncComponent()". Write "() => import('./MyPage.vue')" instead of "defineAsyncComponent(() => import('./MyPage.vue'))"`
-    ).toHaveBeenWarned()
+    expect(`defined using "defineAsyncComponent()"`).toHaveBeenWarned()
+  })
+
+  it('warns if use defineAsyncComponent in routes only once per component', async () => {
+    const router = createRouter({
+      history: createMemoryHistory(),
+      // simulates import('./component.vue')
+      routes: [
+        { path: '/', component },
+        {
+          path: '/foo',
+          component: defineAsyncComponent(() => Promise.resolve({})),
+        },
+        {
+          path: '/bar',
+          component: defineAsyncComponent(() => Promise.resolve({})),
+        },
+      ],
+    })
+    await router.push('/foo')
+    await router.push('/')
+    await router.push('/foo')
+    expect(`defined using "defineAsyncComponent()"`).toHaveBeenWarnedTimes(1)
+    await router.push('/bar')
+    expect(`defined using "defineAsyncComponent()"`).toHaveBeenWarnedTimes(2)
   })
 
   it('warns if no route matched', async () => {

diff --git a/src/navigationGuards.ts b/src/navigationGuards.ts
index 805b3dac92541f8a7ada0a1ce3908f4211528b13..6c6316d6924918c8268bc94523af6ea5a10b7e8b 100644 (file)
--- a/src/navigationGuards.ts
+++ b/src/navigationGuards.ts
@@ -263,8 +263,10 @@ export function extractComponentsGuards(
           rawComponent = () => promise
         } else if (
           (rawComponent as any).__asyncLoader &&
-          guardType === 'beforeRouteEnter'
+          // warn only once per component
+          !(rawComponent as any).__warnedDefineAsync
         ) {
+          ;(rawComponent as any).__warnedDefineAsync = true
           warn(
             `Component "${name}" in record with path "${record.path}" is defined ` +
               `using "defineAsyncComponent()". ` +