Cannot find prop, when prop has a validator.

[MatthijsBe]

Hi,

Just switched to volar, and so far I love it 💯.

But I got a strange error: inside an v-if I check the value of a prop, but volar will say: Cannot find name 'selectionVariant'"

the prop looks like this:

  props: {
    selectionVariant: {
      type: String,
      required: true,
      validator: function (value: string) {
        return ['dropdown', 'tiles'].indexOf(value) !== -1
      }
    }
  },

But when I remove the validator, the error is gone.

[johnsoncodehk]

Hi @MatthijsBe, I think this is defineComponent problem, you can try this:

  props: {
    selectionVariant: {
      type: String,
      required: true,
      validator: function (value: string) {
        return ['dropdown', 'tiles'].indexOf(value) !== -1
      } as never
    }
  },

[MatthijsBe]

@johnsoncodehk Thanks it's working, closing this issue :)

[mesqueeb]

@johnsoncodehk is there no better way to solve this besides having to manually add as never?

I spent almost half a day looking for why vue-tsc --declaration --emitDeclarationOnly doesn't emit any prop information.
Finally i know it's because a single validator in the props... 😅

Do you have ideas for a better solution for this? I'm afraid people who wanna host components on NPM and add type info on the props via vue-tsc --declaration --emitDeclarationOnly that they'll run into the same issues without knowing what's causing it.