dwightjack / eslint-plugin-vue-types Goto Github PK

require-default-prop warns when using shape(), string(), etc. rather than VueTypes.shape, VueTypes.string, etc.

import VueTypes, { shape } from 'vue-types';

const MyComponent = Vue.extend({
  props: {
    data: shape({}).isRequired, // ESLint: Prop 'data' requires default value to be set.(vue-types/require-default-prop)
    data2: VueTypes.shape({}).isRequired, // this is fine
  },
});

First of all: Thanks for the great vue-types plugin!

Using @vue/cli-plugin-eslint 3.0.0-beta.15, I have installed eslint-plugin-vue-types alongside with vue-types and have configured Eslint like this:

  extends: [
    'plugin:vue/essential',
    '@vue/prettier',
    '@vue/typescript',
    'plugin:vue-types/strongly-recommended'
  ],

I get this error:

error: Prop 'href' requires default value to be set (vue-types/require-default-prop) at src/components/_BaseLink.vue:21:5:
  19 | export default Vue.extend({
  20 |   props: {
> 21 |     href: VueTypes.string.def('test')
     |     ^
  22 |   }
  23 | })
  24 | </script>

Once I removed '@vue/typescript' everything is working fine.

So it seems there is a conflict between the two plugins?

Hi Marco, thanks for the plugin again.
I am implementing a more "strong" linter and i am finding issues with the vue-types plugin.
I have a folder where i store common types and re-use them across the application: now it's kind of an issue with the linter because the linter think i'm missing the prop definition.

the only whitelisting feature doesn't really scale tbh. is there another way to do this without whitelisting all the files I am using?