diff --git a/packages/runtime-core/src/componentPublicInstance.ts b/packages/runtime-core/src/componentPublicInstance.ts index e9e7770ebd9..8a769b97180 100644 --- a/packages/runtime-core/src/componentPublicInstance.ts +++ b/packages/runtime-core/src/componentPublicInstance.ts @@ -526,6 +526,11 @@ export const PublicInstanceProxyHandlers: ProxyHandler = { `but is not defined on instance.`, ) } + } else if (__DEV__ && !__TEST__ && !isReservedPrefix(key[0])) { + warn( + `Property ${JSON.stringify(key)} was accessed during render ` + + `but is not defined on instance.`, + ) } }, diff --git a/packages/vue/__tests__/index.spec.ts b/packages/vue/__tests__/index.spec.ts index 0c969f15981..e76577e138a 100644 --- a/packages/vue/__tests__/index.spec.ts +++ b/packages/vue/__tests__/index.spec.ts @@ -311,4 +311,27 @@ describe('compiler + runtime integration', () => { app.mount(root) expect(root.innerHTML).toBe('
60000000100000111
') }) + + test('Warning when use undeclared variable in template', () => { + const app = createApp({ + template: ` +
handler
+
dddd{{dddd}}
+
no warn: {{message}}
+ `, + setup() { + return { + message: 'hello', + } + }, + }) + const root = document.createElement('div') + app.mount(root) + expect( + `[Vue warn]: Property "handler" was accessed during render but is not defined on instance.`, + ).toHaveBeenWarned() + expect( + `[Vue warn]: Property "dddd" was accessed during render but is not defined on instance.`, + ).toHaveBeenWarned() + }) })