👁 Eslint

Serve para verificação de padrões de código no ambiente de desenvolvimento.

Instalação:

$ yarn add eslint -D

Iniciar as verificações de sintaxes.

$ yarn eslint --init

Ao executar o Eslint, aparecerá as seguintes janelas com as seguintes respostas:

? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? None of these
? Does your project use TypeScript? No
? Where does your code run? Node
? How would you like to define a style for your project? Use a popular style guide
? Which style guide do you want to follow? Airbnb (https://github.com/airbnb/javascript)
? What format do you want your config file to be in? JavaScript

Após isso, será iniciado um package-lock.json que deverá ser excluído e rodado um $ yarn na pasta.

O comando $ yarn eslint --fix src --ext .js fará a correção em todos os arquivos .js dentro da pasta src (corrigir com o nome da pasta) e a extensão .js

Arquivo .eslintrc.js

module.exports = {
  env: {
    es6: true,
    node: true,
  },
  extends: [
    'airbnb-base',
  ],
  globals: {
    Atomics: 'readonly',
    SharedArrayBuffer: 'readonly',
  },
  parserOptions: {
    ecmaVersion: 2018,
    sourceType: 'module',
  },
  rules: {
    "class-methods-use-this": "off",
    "no-param-reassign": "off",
    "camelcase": "off",
    "no-unused-vars": ["error", { "argsIgnorePattern": "next" }],
  },
};

💎 Prettier

1. Instalação

$ yarn add prettier eslint-config-prettier eslint-plugin-prettier -D

2. Arquivo .prettierc

{
  "singleQuote": true,
  "trailingComma": "es5"
}

Arquivo .eslintrc

Corrigir e adicionar as linhas:

extends: [
  'airbnb-base',
  'prettier'
],
plugins: ['prettier'],