diff --git a/server/src/services/typescriptService/preprocess.ts b/server/src/services/typescriptService/preprocess.ts
index ff7bc6bbf5..04ad59b6e4 100644
--- a/server/src/services/typescriptService/preprocess.ts
+++ b/server/src/services/typescriptService/preprocess.ts
@@ -299,10 +299,13 @@ function convertChildComponentsInfoToSource(childComponents: ChildComponent[]) {
 
     const propTypeStrings: string[] = [];
     c.info?.componentInfo.props?.forEach(p => {
-      let typeKey = p.required ? kebabCase(p.name) : kebabCase(p.name) + '?';
-      if (typeKey.indexOf('-') !== -1) {
+      let typeKey = kebabCase(p.name);
+      if (typeKey.includes('-')) {
         typeKey = `'` + typeKey + `'`;
       }
+      if (!p.required) {
+        typeKey += '?';
+      }
 
       if (p.typeString) {
         propTypeStrings.push(`${typeKey}: ${p.typeString}`);
diff --git a/test/interpolation/fixture/diagnostics/propTypeValidation/TSChild.vue b/test/interpolation/fixture/diagnostics/propTypeValidation/TSChild.vue
index ba7afd6c34..b4b71c2e00 100644
--- a/test/interpolation/fixture/diagnostics/propTypeValidation/TSChild.vue
+++ b/test/interpolation/fixture/diagnostics/propTypeValidation/TSChild.vue
@@ -8,7 +8,8 @@ export default Vue.extend({
     callback: {
       type: Function as PropType<() => void>
     },
-    arr: Array as PropType<string[]>
+    arr: Array as PropType<string[]>,
+    darkMode: { type: Boolean, default: false }
   }
 });
 </script>