eslint, prettier, webpack, etc,. pollutes the root of a project with lot's of config files
Instead of having them in app root, most libraries allow you to configured custom path for the files
Let's see how to use customize paths for eslint, prettier and webpack
I usually place all config files into config folder
To customize eslint and prettier path create .vscode/settings.json in root of your folder and copy below configs
// NOTE:(VSCODE) Availalbe vscode settings.json variables https://code.visualstudio.com/docs/editor/variables-reference.
{
// NOTE:(VSCODE) On save eslint, prettier and all other configured extensions will be executed the saved file/files.
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll": true
},
"editor.defaultFormatter": "esbenp.prettier-vscode",
"eslint.options": {
// NOTE:(ESLINT) Adding path for eslint config files, we don't need this if config files are in root of the aplication.
"overrideConfigFile": "./config/.eslintrc",
// NOTE:(ESLINT) Adding path for eslint ignore files, we don't need this if config files are in root of the aplication.
"ignorePath": "./config/.eslintignore"
},
// NOTE:(PRETTIER) Adding path for prettier config files, we don't need this if config files are in root of the aplication.
"prettier.configPath": "./config/.prettierrc",
// NOTE:(PRETTIER) Adding path for prettier ignore files, we don't need this if config files are in root of the aplication.
"prettier.ignorePath": "./config/.prettierignore"
}
To use custom webpack path use —config
{
"scripts": {
"build:dev": "webpack --config config/webpack.config.js",
}
}
Top comments (0)