--- title: Tutorial - Padronização e linting automático tags: Adireto --- # Padronizando o Código ## Configuração de Eslint 1. Instalar extensão do Visual Code: ![](https://i.imgur.com/uJER6YY.png) 2. Verificar se essas libs estão instaladas no `package.json` e instalar `yarn install`: ``` json "devDependencies": { "eslint-config-prettier": "^6.10.0", "eslint-config-standard": "^14.1.1", "eslint-plugin-import": "^2.20.1", "eslint-plugin-import-helpers": "^1.0.2", "eslint-plugin-jest": "^23.13.2", "eslint-plugin-node": "^11.1.0", "eslint-plugin-prettier": "^3.1.3", "eslint-plugin-promise": "^4.2.1", "eslint-plugin-standard": "^4.0.1", "eslint-plugin-typeorm": "^0.0.19", } ``` 3. Substituir o código de regras do `.eslintrc.js`: ``` js module.exports = { parser: '@typescript-eslint/parser', parserOptions: { ecmaVersion: 11, project: 'tsconfig.json', sourceType: 'module', }, plugins: [ '@typescript-eslint/eslint-plugin', '@typescript-eslint', 'eslint-plugin-import-helpers' ], extends: [ 'standard', 'plugin:@typescript-eslint/eslint-recommended', 'plugin:@typescript-eslint/recommended', 'prettier/@typescript-eslint', ], root: true, env: { es2020: true, node: true, jest: true, }, rules: { 'semi': [2, "always", { "omitLastInOneLineBlock": true}], '@typescript-eslint/interface-name-prefix': 'off', '@typescript-eslint/explicit-function-return-type': 'off', '@typescript-eslint/no-explicit-any': 'off', 'class-methods-use-this': 'off', 'no-param-reassign': 'off', 'no-new': 'off', 'no-prototype-builtins': 'off', 'no-restricted-syntax': 'off', 'max-classes-per-file': 'off', 'no-console': 'off', 'import/prefer-default-export': 'off', '@typescript-eslint/no-unused-vars': [ 'error', { 'argsIgnorePattern': '_' } ], 'no-useless-constructor': 'off', '@typescript-eslint/naming-convention': [ 'error', { 'selector': 'interface', 'format': [ 'PascalCase' ], 'custom': { 'regex': '^I[A-Z]', 'match': true } } ], "@typescript-eslint/explicit-module-boundary-types": [ "warn" ], 'no-underscore-dangle': 'off', 'import-helpers/order-imports': [ 'warn', { 'newlinesBetween': 'always', // new line between groups 'groups': [ 'module', '/^@server/shared/', '/^@/', [ 'parent', 'sibling', 'index' ] ], 'alphabetize': { 'order': 'asc', 'ignoreCase': true } } ] }, }; ``` 4. Adicionar no `settings.json` para formatar ao salvar o arquivo: ``` json "editor.codeActionsOnSave": { "source.fixAll.eslint": true }, ``` - A partir disso, o visual code já deve formatar automaticamente ao salvar os arquivos. 5. Instalar as dependência para formatação antes de fazer um commit: ```bash $ yarn add -D husky lint-staged ``` 6. Criar dois arquivos para fazer a formatação antes do commit: ``` bash # No arquivo .huskyrc.json: { "hooks": { "pre-commit": "lint-staged", "pre-push": "yarn build" } } # No arquivo .lintstagedrc.json: { "*.ts": [ "yarn lint --fix", "git add", "yarn test --ci --passWithNoTests" ] } ``` 7. Comando para formatar todos os arquivos do projeto: `yarn eslint . --fix --ext .ts`. **Tem algo que não estava no documento?** Não deixe de nos avisar!