Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I enforce filename and folder name convention in typescript eslint?

I am using eslint for typescript convention. And I checked this rule https://github.com/typescript-eslint/typescript-eslint/blob/master/packages/eslint-plugin/docs/rules/naming-convention.md which only works for code.

I am looking for a rule which can enforce filename to be camelCase and folder name to be snake_case. How can I set this rule in typescript?

like image 329
Joey Yi Zhao Avatar asked Jun 19 '20 06:06

Joey Yi Zhao


People also ask

Does typescript-eslint solve file and folder naming separately?

Because Tslint is now deprecated, they created the project typescript-eslint, which is handling file naming casing, you could check it out :) Does it solve file and folder separately? I see it treat file and folder the same. I've found this very new plugin one contributor, from 9 days ago.

Is there an ESLint plugin for file and folder naming?

Some plugins do like eslint-plugin-unicorn or eslint-plugin-filenames. Because Tslint is now deprecated, they created the project typescript-eslint, which is handling file naming casing, you could check it out :) Does it solve file and folder separately? I see it treat file and folder the same.

Why are file and folder naming conventions important?

By using good naming conventions you spare people the frustration of going on a scavenger hunt. At the time when you create the file you may not care but as soon as anyone needs to access the file down the road you may never find it again. Make implementing good file and folder naming conventions a part of your business and your life.

What characters should not be used in a file name?

Characters such as / ? < > \ : * | “ ^ are also prohibited in file or folder names. The only exception to this rule is the ampersand ‘&’. This is okay because all systems accept this and many company names contain an ‘&’. Spaces are acceptable. You don’t need to use an underscore ‘_’ or dash ‘-‘ anymore.


3 Answers

Eslint doesn't implement by default the file name check, see this github issue from 2015.

Some plugins do like eslint-plugin-unicorn or eslint-plugin-filenames.


Because Tslint is now deprecated, they created the project typescript-eslint, which is handling file naming casing, you could check it out :)

like image 176
Orelsanpls Avatar answered Oct 20 '22 21:10

Orelsanpls


Adding a few more resources after the fact - I found for filenames, that eslint-plugin-filename-rules worked well.

For enforcing eslint on folders, eslint-plugin-folders worked for me for directories with files in it. The documentation says only .js and .jsx files but .ts and .tsx files worked for me as well.

like image 32
papers1010 Avatar answered Oct 20 '22 21:10

papers1010


The eslint plugin eslint-plugin-check-file allows you to enforce a consistent naming pattern for the filename and folder.

Apply the camelCase style to filename:

{
   "rules":{
      "check-file/filename-naming-convention":[
         "error",
         {
            "*.{js,ts}":"CAMEL_CASE"
         }
      ]
   }
}

Apply the snake_case style to folder name:

{
   "rules":{
      "check-file/folder-naming-convention":[
         "error",
         {
            "src/**/":"SNAKE_CASE"
         }
      ]
   }
}

Check out this link for more information about eslint-plugin-check-file.

like image 3
Huan Avatar answered Oct 20 '22 20:10

Huan