FoldersLint
Directory structure linter for Front-End projects
Why
Make you project sctructure pretty by linting it
Directory structure rules are important part of any project. These rules help to raise clarity of the project and reduce its complexity. Having a clearly defined structure make developers always know where to put files and where to find them. If the project is big enough, it is necessary to avoid chaos in it.
folderslint
let you configure directory structure rules and check if existed or new files fit these rules.
Quick Overview
Install folderslint
globally:
npm install -g folderslint
Setup a config file .folderslintrc
in the root of the project.
Run folderslint
to check the whole project or a directory (i.e. /components
):
folderslint components
Configuration
folderslint
needs configuration file named .folderslintrc
in the root of the project.
The example of the config:
{
"root": "src", // optional
"rules": [
"components/*",
"pages/components/*/utils",
"hooks",
"legacy/**"
]
}
root
is the directory the structure of which should be checked.
rules
is an array of rules which define permitted directory paths.
Root directory
You have to specify root
if you want to check structure in a specific directory. Directories which are out of the root
will not be checked.
If you want all the directories of the project to be checked, you don't need to specify root
.
Rules syntax
There are 3 ways to specify a rule:
- the exact path of a directory,
*
instead of a directory name if any directory accepted on that level,**
at the end of a rule instead of a directory name if any directory accepted on any lower level.
**
can be used only at the end of a rule because it doesn't make sense to use it at the middle of a rule. It would make any number of nested directories in the middle of a path accepted which gives too much flexibility for the idea of clearly defined directory structure rules.
For example:
Rule | Meaning |
---|---|
hooks |
hooks (and files in it) is accepted. |
components/* |
components is accepted. |
components/*/utils |
components is accepted.utils is accepted. |
legacy/** |
legacy is accepted. |
components/*/legacy/** |
components is accepted.legacy is accepted. |
components/*/utils
automatically make the components
and components/*
rules work. So, no need to specify a rule for every level directory. You need to specify the deepest path.
**
pattern. It lets absence of structure to sprout in your project. Still it could be useful for some directories which have messy structure by its nature - i.e. node_modules
, not maintained legacy directories.
lint-staged
Usage withIt is handy to use folderslint
together with lint-staged
. In this case folderslint
checks only the files which were modified for a commit.
For that, add folderslint
to the lint-staged
section of your package.json
.
For example, this is how package.json
can look like if you want to run folderslint
as a pre-commit hook via husky tool:
"husky": {
"hooks": {
"pre-commit": "lint-staged",
}
},
"lint-staged": {
"*.{js,ts,tsx}": [
"folderslint"
]
}