vue.js - שגיאת TypeScript ב-VS Code עבור Prop מערך של Vue ב-JSDoc: סוג 'ArrayConstructor' חסר את הפרופרטיז הבאים מסוג 'MyCustomType[]'

בהשראת הסעיף "בדיקת סוגים עם JSDoc" ב-"למה אני כבר לא משתמש ב-TypeScript עם React ולמה גם אתה אולי תרצה לעבור", אני משתמש בפרויקט שנוצר עם Vue CLI עם ES6 אבל ללא קומפילציית TypeScript או קוד TypeScript.

הפעלתי את ההגדרה "בדוק JS" ב-Visual Studio Code שמאפשרת לך לבדוק טיפוסיים של קבצי JS שלך כאילו הם TypeScript. בדיקת טיפוסיים "מופעלת" עבור Visual Studio Code דרך הערות JSDoc/@type. אני משתמש בדברים הבאים כדי לשים את קוד ה-JS שלי בקובץ נפרד מקוד ה-Vue שלי:

<script src="./MyComponent.js"></script>

אם אני מנסה להגדיר את הסוג עבור פרופ מסוג Array ברכיב כזה: MyComponent.js

 /**
 * @typedef {object} MyCustomType
 * @property {number} myNumberField
 */

export default {
  props: {
    /** @type {Array<MyCustomType>} */
    resultCards: Array
  }
};

אני נתקל בבעיה הבאה (קוים אדומים מתחת) ב-Visual Studio Code:

Type 'ArrayConstructor' is missing the following properties 
from type 'MyCustomType[]': pop, push, concat, join, and 25 more.ts(2740)

מישהו יודע על פתרון לזה? אני רוצה לשמור על הקוד שלי כ-JavaScript כדי שלא אצטרך להמיר את הפרויקט ל-TypeScript כדי לקבל בדיקת סוגים. אם אין פתרון, אולי פשוט אתעלם מהניסיון להגדיר סוגים לחברי props של Vue.

ראה גם: Microsoft/TypeScript: תמיכת JSDoc ב-JavaScript

עריכה: אם הייתי משתמש ב-TypeScript עם Vue, אני חושב שהקישור הבא היה מכיל את התשובה: אבל אני מנסה להשתמש ב-JavaScript רגיל ו-JSDoc ואז להשתמש בבדיקות סוגים מ-VSCode.

מ- https://frontendsociety.com/using-a-typescript-interfaces-and-types-as-a-prop-type-in-vuejs-508ab3f83480

להמיר את האובייקט לפונקציה שמחזירה את הממשק, כך:

props: {   testProp: Object as () => { test: boolean } }

תשובה #1

חיפשתי עוד קצת והפעם מצאתי את התשובה כאן: https://blog.usejournal.com/type-vue-without-typescript-b2b49210f0b

הייתי צריך לשנות את הקטע שלי למעלה ל:

export default {
  props: {
    /** @type {{ new (): MyCustomType[] }} */
    resultCards: Array
  }
};

תחביר נוסף שגם עובד (שאני אוהב יותר) הוא:

export default {
  props: {
    /** @type {{ new (): Array<MyCustomType> }} */
    resultCards: Array
  }
};