Sobes.tech
Middle

Como é que acompanhas a conformidade com o estilo de código no teu projeto?

sobes.tech IA

Resposta da IA

Para manter um estilo de código uniforme, utilizo as seguintes ferramentas e processos:

  1. ESLint: Configuro regras de formatação e qualidade do código (por exemplo, Airbnb ou Standard). O ESLint ajuda a identificar erros de sintaxe, problemas de indentação, variáveis não utilizadas, etc.

    // Exemplo .eslintrc.js
    module.exports = {
      extends: 'airbnb-base', // Ou outro estilo escolhido
      rules: {
        // Sobrescrever ou adicionar regras
        'semi': ['error', 'always'],
        'quotes': ['error', 'single']
      }
    };
    
  2. Prettier: Integro o Prettier para formatar automaticamente o código. Ele cuida de espaços, quebras de linha, pontos e vírgulas e outros detalhes de formatação, trabalhando em conjunto com o ESLint (através de plugins).

    // Exemplo .prettierrc.json
    {
      "semi": true,
      "singleQuote": true,
      "printWidth": 100
    }
    
  3. Husky e lint-staged: Configuro hooks pre-commit com Husky. Com lint-staged, executo ESLint e Prettier apenas nos ficheiros que foram modificados (staged). Isto garante que apenas código formatado e verificado seja enviado.

    // Exemplo package.json (parte)
    {
      "husky": {
        "hooks": {
          "pre-commit": "lint-staged"
        }
      },
      "lint-staged": {
        "*.{js,jsx,ts,tsx}": [
          "eslint --fix",
          "prettier --write"
        ],
        "*.{css,scss,less}": [
          "stylelint --fix", // Se usar Stylelint
          "prettier --write"
        ],
        "*.{html,vue,svelte}": [
          "prettier --write"
        ]
      }
    }
    
  4. Revisões de código: No processo de revisão de código, presto atenção ao cumprimento das convenções de estilo de código estabelecidas, mesmo que as ferramentas automáticas tenham omitido algo ou haja nuances não cobertas pelas regras.

  5. Documentação: Mantenho uma documentação mínima sobre o estilo de código aceite no projeto (por exemplo, no README ou CONTRIBUTING.md), para que os novos membros da equipa possam familiarizar-se rapidamente com as regras.

  6. Integração na IDE: Configuro os editores (VS Code, WebStorm, etc.) para formatar automaticamente ao guardar e mostrar erros do ESLint diretamente no editor.