Vue 3 / Typescript: "Cannot find name" in template variable

Question

In Vue 3 / Typescript, I am getting the following error:

"Cannot find name", when referencing a data variable into the ... area.

How can I solve this?

Please see the attached screenshot.

Many thanks in advance.

Answer 1

I had a similar issue when I added lang="ts" to the vue file as I'm new to Vue 3 and Typescript. I resolved it by ensuring the following:

export default 

to

export default defineComponent({

in your .vue file.

Ensure you add the import.

import { defineComponent }

Your data should reside in the setup as well.

setup () {
  return {
    loader: false,
    error: false,
    firstTime: false