ESLint, Prettier, Stylelint configs by Varp
npm install eslint-config-varp1. Setup
2. User cases:
* Override rules
* Ignore path
3. Notes
1. Install:
``js`
npm install -D eslint-config-varp
2. Add prettier config to the package.json:
`js`
"prettier": "eslint-config-varp/prettier",
3. Create eslint.config.js file with content:
`js
const { defineConfig } = require("eslint/config");
const configs = require("eslint-config-varp");
module.exports = defineConfig([
extends: [varp.eslint.base, varp.eslint.typescript, varp.eslint.react],
rules: {
/ Eslint rules /
}
]);
`
4. Add .vscode/settings.json file with content:`json`
{
"editor.tabSize": 2,
"editor.defaultFormatter": "dbaeumer.vscode-eslint",
"eslint.format.enable": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "always"
},
"eslint.validate": [
"typescript",
"typescriptreact",
"javascript",
"javascriptreact",
"markdown",
"json",
"jsonc"
],
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[scss]": {
"editor.codeActionsOnSave": {
"source.fixAll.stylelint": "always"
},
"editor.defaultFormatter": "stylelint.vscode-stylelint"
},
"stylelint.validate": ["scss"],
"stylelint.snippet": ["scss"],
"stylelint.enable": true
}
5. Add new scripts to package.json:
`json`
"scripts": {
"lint": "eslint .",
"lint:fix": "eslint . --fix",
"stylelint": "stylelint \"*/.scss\"",
"stylelint:fix": "stylelint \"*/.scss\" --fix",
}
* Add overrides property in config file
`js`
module.exports = {
overrides: [
{
files: ["//.js"],
rules: {
/ Overrided rules /
},
},
],
};
* Create file in selected folter: .eslintrc.js`
* Add content:js`
module.exports = {
extends: '../.eslintrc.js',
rules: {
/ Overrided rules /
}
};$3
`js`
overrides: [
{
files: ["folder/*/.js"],
rules: {
/ Overrided rules /
}
}
]
`js
const { defineConfig } = require("eslint/config");
const configs = require("eslint-config-varp");
module.exports = defineConfig([
extends: [varp.eslint.base, varp.eslint.typescript, varp.eslint.react],
{
ignores: ["stories", "*/.txt"],
},
]);
`
- typescript package is not on peerDependencies`, but it require to be on the project.