Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

False positive with vue/require-default-prop #1591

Closed
2 tasks done
JJBocanegra opened this issue Aug 2, 2021 · 0 comments · Fixed by #1592
Closed
2 tasks done

False positive with vue/require-default-prop #1591

JJBocanegra opened this issue Aug 2, 2021 · 0 comments · Fixed by #1592
Labels

Comments

@JJBocanegra
Copy link

Checklist

  • I have tried restarting my IDE and the issue persists.
  • I have read the FAQ and my problem is not listed.

Tell us about your environment

  • ESLint version: 7.32.0
  • eslint-plugin-vue version: 7.15.0
  • Node version: 16.4.1
  • Operating System: MacOS Big Sur 11.5.1

Please show your full configuration:

module.exports = {
  root: true,

  env: {
    node: true,
    'jest/globals': true,
  },

  plugins: ['jest'],

  extends: [
    // add more generic rulesets here, such as:
    'airbnb-base',
    'eslint:recommended',
    'plugin:vue/vue3-recommended',
    'plugin:jest/recommended',
    'plugin:jest/style',
  ],

  parserOptions: {
    parser: '@typescript-eslint/parser',
  },

  globals: {
    google: 'readonly',
    RecursivePartial: 'readonly',
  },

  ignorePatterns: ['*.json'],

  rules: {
    // ESLINT
    'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'warn',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'warn',
    quotes: ['error', 'single'],
    'prefer-destructuring': ['error', {
      object: true,
      array: false,
    }],
    'import/no-unresolved': 'off',
    'import/extensions': 'off',
    'import/no-extraneous-dependencies': 'off',
    'import/prefer-default-export': 'off',

    'operator-linebreak': ['error', 'after'],
    'comma-spacing': ['error'],
    'comma-dangle': ['error', 'always-multiline'],
    'arrow-spacing': ['error'],
    'brace-style': ['error'],
    'comma-style': ['error', 'last'],
    'dot-location': ['error', 'property'],
    'dot-notation': ['error'],
    eqeqeq: ['error'],
    'func-call-spacing': ['error', 'never'],
    'key-spacing': ['error'],
    'keyword-spacing': ['error'],
    'no-extra-parens': ['error'],
    'no-useless-concat': ['error'],
    'object-curly-spacing': ['error', 'always'],
    'prefer-template': ['error'],
    'space-in-parens': ['error', 'never'],
    'space-infix-ops': ['error'],
    'space-unary-ops': [
      2, {
        words: true,
        nonwords: false,
      }],
    'template-curly-spacing': ['error'],
    'no-use-before-define': ['error', { functions: false }],
    'max-len': 'off',

    // Vue Uncategorized
    'vue/html-comment-content-newline': ['error', {
      singleline: 'never',
      multiline: 'always',
    }],
    'vue/custom-event-name-casing': ['error', 'camelCase'],
    'vue/component-name-in-template-casing': ['error', 'PascalCase'],
    'vue/html-comment-content-spacing': ['error', 'always'],
    'vue/html-comment-indent': ['error', 'tab'],
    'vue/match-component-file-name': ['error', { extensions: ['vue'], shouldMatchCase: true }],
    'vue/new-line-between-multi-line-property': ['error'],
    'vue/no-duplicate-attr-inheritance': ['error'],
    'vue/no-empty-component-block': ['error'],
    'vue/no-invalid-model-keys': ['error'],
    'vue/no-multiple-objects-in-class': ['error'],
    'vue/no-potential-component-option-typo': ['error', { presets: ['all'] }],
    'vue/no-reserved-component-names': ['error', {
      disallowVueBuiltInComponents: false,
      disallowVue3BuiltInComponents: false,
    }],
    'vue/no-static-inline-styles': ['error'],
    'vue/no-unused-properties': ['error'],
    'vue/no-unused-refs': ['error'],
    'vue/no-useless-mustaches': ['error'],
    'vue/no-useless-v-bind': ['error'],
    'vue/padding-line-between-blocks': ['error', 'always'],
    'vue/require-direct-export': ['error'],
    'vue/script-indent': ['error'],
    'vue/v-for-delimiter-style': ['error', 'in'],
    'vue/v-on-event-hyphenation': ['error', 'never'],
    'vue/v-on-function-call': ['error', 'always'],
    'vue/script-setup-uses-vars': ['off'],

    // Vue Extension Rules
    'vue/comma-spacing': ['error'],
    'vue/comma-style': ['error', 'last'],
    'vue/dot-location': ['error', 'property'],
    'vue/dot-notation': ['error'],
    'vue/eqeqeq': ['error'],
    'vue/func-call-spacing': ['error', 'never'],
    'vue/key-spacing': ['error'],
    'vue/keyword-spacing': ['error'],
    'vue/no-constant-condition': ['error'],
    'vue/no-empty-pattern': ['error'],
    'vue/no-extra-parens': ['error'],
    'vue/no-irregular-whitespace': ['error'],
    // 'vue/no-restricted-syntax': ['error', {
    //   selector: 'VElement > VExpressionContainer CallExpression',
    //   message: 'Can\'t call expressions inside mustache interpolation',
    // }],
    'vue/no-sparse-arrays': ['error'],
    'vue/no-useless-concat': ['error'],
    'vue/object-curly-spacing': ['error', 'always'],
    'vue/prefer-template': ['error'],
    'vue/space-in-parens': ['error', 'never'],
    'vue/space-infix-ops': ['error'],
    'vue/template-curly-spacing': ['error'],
    'vue/v-slot-style': ['error', { default: 'v-slot', atComponent: 'v-slot', named: 'longform' }],

    // SPECIALS

    // Use this to detect bare strings to replace with i18n https://eslint.vuejs.org/rules/no-bare-strings-in-template.html
    // 'vue/no-bare-strings-in-template': ['error'],
  },

  overrides: [{
    files: ['*.vue'],
    rules: {
      'no-unused-vars': 'off',
    },
  }, {
    files: ['*.d.ts'],
    rules: {
      'no-unused-vars': 'off',
    },
  }],
};

What did you do?

<template>
  <div>
    {{ required }}
    {{ optional }}
  </div>
</template>

<script setup lang="ts">
import { defineProps, withDefaults } from 'vue';

interface Props {
  required: boolean;
  optional?: boolean;
}

const props = withDefaults(defineProps<Props>(), {
  optional: false,
});
</script>

What did you expect to happen?
The required prop should not list any warning because is a required property

What actually happened?

  12:3  warning  Prop 'required' requires default value to be set  vue/require-default-prop

Repository to reproduce this issue
I'll try to make one the next week, I don't have time this :(

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
2 participants