DV-specific code linters configs

Currently, we are using the following configs:

Eslint

@dvdevcz/eslint-config-base
@dvdevcz/eslint-config-react for React projects @dvdevcz/eslint-config-typescript for Typescript projects

NOTE: React config and typescript already contains base config, so there is no need to install both

Stylelint

@dvdevcz/stylelint-config with PostCss

TSconfig

@dvdevcz/typescript-config

How to use

Install and config

In the project where you want to use linters, do the following:

1. Install required linter config(s)

yarn add -D @dvdevcz/eslint-config-base
# OR
yarn add -D @dvdevcz/eslint-config-react
# OR
yarn add -D @dvdevcz/eslint-config-typescript
# OR
yarn add -D @dvdevcz/stylelint-config
# OR
yarn add -D @dvdevcz/typescript-config

2. Add following to your package.json (or add extends to your .eslintrc or .stylelintrc config)

"eslint": {
  "extends": [
      // in case of Typescript
      "@dvdevcz/eslint-config-typescript",
      // in case of React
      "@dvdevcz/eslint-config-react",
      // in case of NodeJs
      "@dvdevcz/eslint-config-base",
  ]
}

"stylelint": {
  "extends": "@dvdevcz/stylelint-config/config"
}

3. In a typescript project, add the following to your tsconfig.json

{
  "extends": "@dvdevcz/typescript-config"
}

Adding a pre-commit hook

Linting makes more sense when running before committing the code.

To add a pre-commit task:

1. Install Husky and lint-staged

yarn add husky lint-staged -D

2. Automatically install the pre-commit hook and add a script to your package.json

npx husky install && \
npx husky add .husky/pre-commit "yarn pre-commit" && \
npx npm-add-script -k pre-commit -v "lint-staged"

3. Create .lintstagedrc and add the following code (omit a stylelint if it's not needed)

{
    "*.{js,jsx}": [
      "eslint --cache --fix"
    ],
    "*.css": [
      "stylelint --cache --fix --color --formatter verbose"
    ]
}