vuejs3 - το component Vue3 με TypeScript δεν μπορεί να καλέσει μέθοδο σε global mixin


Έχω δυσκολευτεί με αυτό για περίπου μια εβδομάδα τώρα, οπότε αν κάποιος ξέρει, θα ήμουν ευγνώμων αν μπορούσατε να με βοηθήσετε.

Έχω μετατρέψει κώδικα βασισμένο στο vue2 σε vue3 ως νέο έργο. Δεν χρησιμοποιώ το Composition API, αλλά το χρησιμοποιώ με τον τρόπο των αντικειμενοστραφών components.

Δεδομένου ότι εξωτερικά modules γραμμένα σε TypeScript επίσης εισάγονται και χρησιμοποιούνται, το component περιβάλλεται με το defineComponent().

Όλα λειτουργούν καλά, αλλά το μέρος με το global mixin είναι το πρόβλημα. Όπως περιγράφεται στο επίσημο έγγραφο του Vue, το mixin που γράφτηκε σε *.js καταχωρήθηκε ως global mixin με το app.mixin().

 // mixin.js 
 export default {
   methods: {
     registerBackButtonCallback() {}
   }
 }

Αν καλέσω αυτό.registerBackButtonCallback() στο αρχείο του component,

'Ο τύπος 'never' δεν έχει υπογραφές κλήσεων'

σφάλμα και αποτυχία μεταγλώττισης. αλλά η κλήση αυτής της.registerBackButtonCallback() λειτουργεί καλά όταν τη χρησιμοποιώ ως τοπικό mixin.

Ένα σφάλμα προκύπτει μόνο όταν το <script lang="ts"> έχει οριστεί. Συντάσσεται χωρίς σφάλμα όταν η επιλογή "strict" ή "noImplicitThis" στο "tsconfig.json" έχει οριστεί σε false.

Για τους παραπάνω λόγους, πιστεύω ότι αυτό το σφάλμα πρέπει να σχετίζεται με το typescript. Σκέφτηκα ότι θα ήταν καλό να κάνω επιχειρηματολογία τύπου, οπότε στο src/shims-vue.d.ts, όπως το παρακάτω, προσπάθησα να το προσθέσω, αλλά εξακολουθώ να λαμβάνω το σφάλμα.

declare module 'vue/types/vue' {
  interface Vue {
    registerBackButtonCallback: () => void
  }
}

Έχει κανείς δοκιμάσει να καλέσει μέθοδο global mixin με script lang="ts" σε component του Vue3;

Ευχαριστώ πολύ για τη συμβουλή σου.

Απάντηση #1

Η προσαρμογή του τύπου Vue είναι μια πρακτική του Vue2. Στο Vue3, οι προσαρμοσμένες ιδιότητες ορίζονται στο ComponentCustomProperties του '@vue/runtime-core'