diff --git a/packages/components/src/runtime/components.tmpl.d.ts b/packages/components/src/runtime/components.tmpl.d.ts
index 87a957c018..e0fc53e8a9 100644
--- a/packages/components/src/runtime/components.tmpl.d.ts
+++ b/packages/components/src/runtime/components.tmpl.d.ts
@@ -1,7 +1,7 @@
 declare module 'vue' {
   export interface GlobalComponents {
 <%= components.map(c => {
-  return `    ${c.pascalName}: typeof import('${c.filePath}')['${c.export}']`
+  return `    '${c.pascalName}': typeof import('${c.filePath}')['${c.export}']`
 }).join(',\n') %>
   }
 }
diff --git a/packages/components/src/runtime/components.tmpl.mjs b/packages/components/src/runtime/components.tmpl.mjs
index 91232b33c8..d34d0d6332 100644
--- a/packages/components/src/runtime/components.tmpl.mjs
+++ b/packages/components/src/runtime/components.tmpl.mjs
@@ -10,7 +10,7 @@ const components = {
     c.preload === true || typeof c.preload === 'number' ? `webpackPreload: ${c.preload}` : false,
   ].filter(Boolean).join(', ')
 
-  return `  ${c.pascalName}: defineAsyncComponent(() => import('${c.filePath}' /* ${magicComments} */).then(c => ${exp}))`
+  return `  '${c.pascalName}': defineAsyncComponent(() => import('${c.filePath}' /* ${magicComments} */).then(c => ${exp}))`
 }).join(',\n') %>
 }
 
diff --git a/packages/components/src/scan.ts b/packages/components/src/scan.ts
index cc86a0eaef..433f46f5f7 100644
--- a/packages/components/src/scan.ts
+++ b/packages/components/src/scan.ts
@@ -62,7 +62,7 @@ export async function scanComponents (dirs: ScanDir[], srcDir: string): Promise<
       }
       resolvedNames.set(componentName, filePath)
 
-      const pascalName = pascalCase(componentName)
+      const pascalName = pascalCase(componentName).replace(/["']/g, '')
       const kebabName = hyphenate(componentName)
       const shortPath = relative(srcDir, filePath)
       const chunkName = 'components/' + kebabName