eslint-plugin-validate-filename

ESLint rule to force file names format. Create common rules for file names by folder name or regex pattern.

Install

npm install --save-dev eslint-plugin-validate-filename

Uasge

{
  "plugins": ["validate-filename"]
}

validate-filename/naming-rules

Create a rule in the name of ESLint. You can set multiple rules.

{
  "rules": {
    "validate-filename/naming-rules": [
      "error",
      {
        rules: [
          {
            case: 'pascal', // camel or pascal or snake or kebab or flat
            target: "**/components/**", // target "components" folder
            excludes: ['hooks'], // "hooks" folder is excluded.
          }
          {
            case: 'camel',
            target: "**/hooks/**", // target "hooks" folder
            patterns: '^use', // file names begin with "use".
          }
        ] 
      }
    ],
}

validate-filename/limit-extensions

Only certain extensions are allowed. target is a regular expression that identifies the folder. extensions you want to allow for extensions.

{
  "rules": {
    "validate-filename/limit-extensions": [
      "error",
      {
        rules: [
          {
            target: "**/hooks/**",
            extensions: ['.ts', '.tsx'], // This cannot be created except for .ts or .tsx under the hooks folder.
          }
        ]
      }
    ],
}

Next.js structure settings example

See Next.js naming conventions are checked with ESLint rules article.