5
respostas

ESLINT.CONFIG.JS

Olá devs tudo bem? Queria deixar uma dúvida que tenho, ao executar o comando de instalação do eslint ele instala um arquivo eslint.config.js, diferente do que a instrutora passou. E agora? O que devo fazer? Preciso de um passo a passo, pois vi na documentação do eslint que o novo padrão seriam arquivos .js mesmo.

5 respostas

Olá João, tudo bem?

O ESLint passou a adotar arquivos de configuração em formato .js como padrão, o que pode ter causado essa diferença em relação ao material do curso.

Você pode tentar adaptar a configuração do ESLint utilizando o arquivo eslint.config.js, através do passo a passo:

  1. Instalação do ESLint: Execute o comando de instalação do ESLint, caso ainda não tenha feito:

    npm init @eslint/config
    
  2. Configuração do ESLint: Durante a configuração, responda às perguntas conforme necessário. Ao final, ele gerará o arquivo eslint.config.js.

  3. Adaptação da Configuração: Se o material do curso utiliza um arquivo eslintrc.json, você pode converter as configurações para o formato .js. Aqui está um exemplo de como seria a configuração em eslint.config.js:

    module.exports = {
        env: {
            browser: true,
            es2021: true,
            node: true
        },
        extends: 'eslint:recommended',
        parserOptions: {
            ecmaVersion: 12,
            sourceType: 'module'
        },
        rules: {
            indent: ['error', 2],
            'linebreak-style': ['error', 'unix'],
            quotes: ['error', 'double'],
            semi: ['error', 'always']
        }
    };
    
  4. Verificação e Correção Automática: Certifique-se de que a extensão do ESLint está instalada no seu editor de código (como o VSCode) para que ele possa identificar e corrigir os problemas automaticamente.

  5. Execução do ESLint: Para verificar e corrigir os problemas no seu código, utilize o comando:

    npx eslint . --fix
    

Esse passo a passo deve te ajudar a alinhar a configuração do ESLint com o que foi apresentado no curso, mesmo utilizando o novo formato .js.

Espero ter ajudado. Qualquer dúvida manda aqui. Bons estudos.

Oii, tudo bem dev? Então, seguindo os passos acima ainda não funcionou. Conseguem me dar uma explicação ATUALIZADA de como utilizar o eslint?

Oi João.

Nessse caso, tenta fazer da seguinte forma conforme essa solução do tópico: Erro ao configurar eslint

Veja se faz sentido e se funciona. Você vai precisar criar o arquivo .eslintrc.json.

Qualquer coisa manda aqui.

Seguindo os passos informados, no tópico apareceu esse erro :( Não consigo usar o eslint pois o vídeo da instrutora está com o formato antigo do eslint e eles atualizaram para um formato novo, teriam como fazer um vídeo mostrando como configurar e instalar o novo eslint?

Oops! Something went wrong! :(

ESLint: 9.8.0

ESLint couldn't find an eslint.config.(js|mjs|cjs) file.

From ESLint v9.0.0, the default configuration file is now eslint.config.js. If you are using a .eslintrc.* file, please follow the migration guide to update your configuration file to the new format:

Olá, João.

Já tenho uma solução para você! Testada e aprovada.

Basta colar esse código no seu arquivo eslint.config.json:

import globals from "globals";
import pluginJs from "@eslint/js";

export default [
  {
    languageOptions: {
      globals: {
        ...globals.browser,
        ...globals.node,
      },
    },
    rules: {
      indent: ["error", 2],
      "linebreak-style": ["error", "unix"],
      quotes: ["error", "double"],
      semi: ["error", "always"],
    },
  },
  pluginJs.configs.recommended,
];

Um detalhe: eu rodei o comando npx eslint . --fix e apresentou um erro, porém adicionando as configuração nas "Preferências" do VSCode igual é mostrado na aula, funcionou! Ele corrigi os erros presentes no arquivo quando você salva esse arquivo, por exemplo o app.js. Se o app.js estiver com erro basta salvar o arquivo novamente com CTRL + S e pronto, ele arruma os pontos e vírgulas, e as aspas, os erros somem.

testa aí. Qualquer coisa manda aqui de novo. Valeu.