Feature request: option to ignore single-word filenames and sentences in vue/match-component-file-name

[daniluk4000]

What rule do you want to change? vue/match-component-file-name

Does this change cause the rule to produce more or fewer warnings? Fewer.

How will the change be implemented? (New option, new default behavior, etc.)?

• New option (ex. ignoreSingleWord or something like that)
• New option (ex. ignorePatterns or something like that)

Please provide some example code that this change will affect:

//pages/index.vue or pages/catalog-service.vue

<template>
    <nuxt-child/>
</template>

<script lang="ts">
import { defineComponent } from 'vue';

export default defineComponent({
    name: 'CatalogPage',
});

What does the rule currently do for this code? ESLint: Component name CatalogPage should match file name index.(vue/match-component-file-name)

What will the rule do after it's changed? No warning or error

Additional context My motivation for this is Nuxt usage. Nuxt requires us to name layouts/pages in the same way as we want them to be (layout name default, index-page e.t.c.).

Rule vue/multi-word-component-names forces us to use multi-word component names and we love and need that. But we also need file name to match name everywhere except for such files.

My suggestion is to add new option for this rule, ignoreSingleWord or something like that, that will force name to match filename for all files except with single word in them.

Also it would be great to have ignorePatterns, so, for example, if component name has "page" in it, rule would not apply ("CatalogPage" or else).

[MorevM]

@daniluk4000

I'm not a contributor of this project, but I know the author's stand on such changes - you can already turn this rule off specifically for such files using ESLint overrides.

// .eslintrc.cjs
module.exports = {
  // ...
  overrides: [
    {
      files: [
        './frontend/views/layouts/**/*.vue',
        './frontend/views/pages/**/*.vue',
      ],
      rules: {
        // Nuxt limitation for pages and layouts.
        'vue/multi-word-component-names': 'off',
        'vue/match-component-file-name': 'off',
      },
    },
  ],
};

[daniluk4000]

@daniluk4000

I'm not a contributor of this project, but I know the author's stand on such changes - you can already turn this rule off specifically for such files using ESLint overrides.

// .eslintrc.cjs
module.exports = {
  // ...
  overrides: [
    {
      files: [
        './frontend/views/layouts/**/*.vue',
        './frontend/views/pages/**/*.vue',
      ],
      rules: {
        // Nuxt limitation for pages and layouts.
        'vue/multi-word-component-names': 'off',
        'vue/match-component-file-name': 'off',
      },
    },
  ],
};

Nice idea, thank you!

I would still like those changes to be in a rule though, but will use your solution, thanks!