Method's first letter gets dropped, produces "Property _________ does not exist on type 'CombinedVueInstance'"



  • I am very confused by this. My app is working just fine as a web app, but I’m getting three Vetur errors that I can’t make head or tail out of.

    Property 'tartPlay' does not exist on type 'CombinedVueInstance<{ feed: any; showDescription: any; showImage: any; oldElement: number; newElement: number; elapsedTime: number; state: string; timeupdate: number; listener: { listener_id: number; listener_name: string; date_last_logon: string; }; episode: {}[]; value: number; } & { ...; } & { ...; } & Record<......'. Did you mean 'startPlay'?
    
    Property 'laying' does not exist on type 'CombinedVueInstance<{ feed: any; showDescription: any; showImage: any; oldElement: number; newElement: number; elapsedTime: number; state: string; timeupdate: number; listener: { listener_id: number; listener_name: string; date_last_logon: string; }; episode: {}[]; value: number; } & { ...; } & { ...; } & Record<......'. Did you mean 'playing'?
    
    Property 'aused' does not exist on type 'CombinedVueInstance<{ feed: any; showDescription: any; showImage: any; oldElement: number; newElement: number; elapsedTime: number; state: string; timeupdate: number; listener: { listener_id: number; listener_name: string; date_last_logon: string; }; episode: {}[]; value: number; } & { ...; } & { ...; } & Record<......'. Did you mean 'paused'?
    

    Here’s the code:

    <template>
      <q-page class="flex-center">
        <div class="padDiv">
          <img style="width: 100px; float: left; margin-right: 20px;" :src="this.showImage">
          <h5>LOA Today</h5>
          <p>{{ this.showDescription }}</p>
        </div>
        <div style="clear: both;"></div>
        <div style="margin-top: 18px;">
          <hr>
        </div>
        <div class="padDiv">
          <div v-for="item in feed" :key="item.element">
            <h6
              @click="startPlay(item.element)"
              class="pointer"
              >{{  item.title }}</h6>
            <p><span style="color: white;">{{ item.date }} &ndash; </span> {{ item.description }} <span style="color: green;">Show #{{ item.episodeNumber }}</span></p>
            <player
              :mp3="item.mp3"
              ref="pauseMe"
              @timeupdate="currentTime($event, item.element)"
              @playing="playing(item, item.element)"
              @paused="paused(item, item.element)"
            ></player>
            <net-status ref="netStatus" :listener="listener" :episode="episode" />
            <hr>
          </div>
        </div>
      </q-page>
    </template>
    

    I did find three pages via Google referring to this error when using Typescript. The problem with this in my case is that I am not using Typescript.

    Why am I getting these three errors?



  • I had a very similar issue, the property for which this happens, please try to accommodate the entire tag into one line and see if it works, this is weird but works for me every time. Let me know if that works.



  • I found out what is going on with this. It appears to be an issue with Visual Studio Code using CRLF vs just LF. It can be repaired by opening Visual Studio Code, pressing ctrl-shift-P in Windows (crtl-cmd-P on Macs) and typing Change End Of Line Sequence into the field. Click on it when it appears, and you’ll get two options: LF and CRLF. Choose LF. That should take care of it.


Log in to reply