Partilhar via

Efetuar o lint do JavaScript no Visual Studio

  • Artigo

O lint do JavaScript e do TypeScript no Visual Studio é feito pela plataforma ESLint. Se você for novo no ESLint, poderá começar verificando a documentação.

Habilitar o suporte para lint

Para habilitar o suporte para lint no Visual Studio 2022 ou versões posteriores, habilite a configuração Habilitar ESLint em Ferramentas > Opções > Editor de texto > JavaScript/TypeScript > Lint.

Screenshot of linting Tools Options page.

Na página de opções, você também pode modificar o conjunto de arquivos ao qual deseja efetuar o lint. Por padrão, o lint será efetuado em todas as extensões de arquivo que podem passar por lint (.js, .jsx, .ts, .tsx, .vue.html). O editor de HTML baseado em LSP deve ser habilitado para efetuar o lint de arquivos Vue e HTML. A respectiva configuração pode ser encontrada em Ferramentas > Opções > Ambiente > Versões prévias do recurso.

Você pode substituir essas opções em alguns tipos de projeto, como os modelos de projeto React autônomos. Nesses projetos, você pode substituir as configurações na página Ferramentas > Opções usando as propriedades do projeto:

Screenshot of linting project properties.

Instalar dependências do ESLint

Depois que o lint estiver habilitado, as dependências necessárias precisarão ser instaladas. As dependências incluem o pacote ESLint npm e outros plug-ins aplicáveis ao seu projeto. Esse pacote pode ser instalado localmente em cada projeto em que você deseje habilitar o lint, ou você pode instalá-lo globalmente usando npm install -g eslint. No entanto, não se recomenda fazer uma instalação global porque plug-ins e configurações compartilháveis sempre precisam ser instalados localmente.

A partir da versão prévia 2 da versão 17.7 do Visual Studio 2022, você também pode usar a configuração Caminho ESLint emFerramentas > Opções > Editor de Texto > JavaScript/TypeScript > Linting para especificar um diretório do qual carregar o ESLint. Isso é útil quando o ESLint é instalado globalmente, onde você pode definir o caminho correspondente para C:\Program Files\nodejs\node_modules.

Dependendo dos arquivos nos quais você deseja efetuar lint, podem ser necessários outros plug-ins ESLint. Por exemplo, talvez você precise do TypeScript ESLint, que permite que o ESLint seja executado no código TypeScript e inclui regras específicas para as informações de tipo extra.

Quando o ESLint está habilitado, mas não é possível encontrar o pacote ESLint npm, uma barra dourada é exibida, o que permite instalar o ESLint como uma dependência de desenvolvimento local npm.

Screenshot of Install ESLint gold bar.

Da mesma forma, quando não é encontrado um arquivo .eslintrc, uma barra dourada é exibida para executar um assistente de configuração que instalará os plug-ins aplicáveis ao projeto atual.

Screenshot of Run ESLint wizard gold bar.

Desabilitar regras de lint e correções automáticas

Você pode desabilitar erros de lint em uma linha ou arquivo específico. Você pode desabilitar os erros usando o menu de lâmpada Ações Rápidas:

Screenshot of linting Quick Actions.

A ilustração a seguir mostra o que ocorrerá se você desabilitar um erro de lint de uma linha de código selecionada.

Screenshot of disabled linting rule.

Além disso, as ações de correção automática de código permitem que você aplique uma correção automática para resolver o respectivo erro de lint.

Solução de problemas

Você pode abrir o painel Extensão de linguagem do ESLint na janela Saída para ver quaisquer mensagens de erro ou outros logs que possam explicar o problema.