Ferramentas JavaScript e TypeScript
Conte com o ReSharper sempre que você usar o JavaScript ou o TypeScript para programar apenas uma parte ou toda a lógica do seu aplicativo. Seus recursos estão disponíveis em arquivos .js, .ts, .d.ts e .json, no código JavaScript embutido em arquivos HTML e também na sintaxe JSX.
Análise de código
Os recursos de análise de código do ReSharper ajudam a localizar e corrigir erros e problemas rapidamente, com cerca de 100 inspeções de código para código JavaScript e TypeScript e mais 50 inspeções especificas para TypeScript. Quase todos os problemas detectados podem ser corrigidos instantaneamente com correções rápidas.
No exemplo aqui, digitar = onde a intenção era digitar ==, pode levar a um bug muito sutil... mas não com o ReSharper.
Ao analisar seu código, o ReSharper leva em consideração o nível da linguagem, que é configurável. Por padrão, um nível de linguagem é selecionado com base nas configurações do projeto, mas você pode substituir essas configurações se necessário.
Navegação e pesquisa
A maioria dos recursos de navegação e pesquisa do ReSharper está disponível em JavaScript e TypeScript. Como sempre, todos os comandos de navegação de um símbolo específico estão disponíveis com o atalhado Navigate To: Alt+`.
Todos os seus comandos de pesquisa favoritos, como Ctrl+T (Go to Everything/Type) e Ctrl+Shift+T (Go to File) também estão disponíveis. Todos os recursos de navegação e pesquisa com suporte levam em conta as especificações das sintaxes JavaScript e TypeScript. Por exemplo, a janela File Structure pode exibir tipos de dados de parâmetros caso eles estejam especificados na documentação XML.
O recurso de Pesquisa e substituição estruturais também reconhece a sintaxe JavaScript/TypeScript.
Complementação de código
Recursos de preenchimento de código ajudam você a escrever código JavaScript/TypeScript mais rápido. Enquanto você digita, o ReSharper analisa o contexto ao redor e os símbolos recém-inseridos para sugerir valores adequados na lista de preenchimento. Por exemplo, o ReSharper pode ajudá-lo a encontrar métodos e propriedades JavaScript integrados, além de símbolos de bibliotecas JavaScript referenciadas no projeto atual.
Ações de contexto e outros auxiliares
O ReSharper permite a rápida conversão de bits de código JavaScript/TypeScript com 50 ações de contexto para JavaScript e TypeScript mais cerca de 20 ações específicas para TypeScript.
Todo o arsenal de outras ferramentas de assistência para codificação do ReSharper — realce de sintaxe, reorganização do código, extensão/recolhimento de seleção, entre vários outros — também está à sua disposição no código JavaScript e TypeScript.
Suporte para JSDoc
O ReSharper facilita a leitura de comentários do JSDoc, destacando sua sintaxe. Quando você digita comentários JSDoc, o ReSharper ajuda preenchendo sua entrada. Por exemplo, você pode digitar /** acima de uma função, e o ReSharper gerará stubs de documentação para todos os parâmetros e para o valor de retorno. Tipos JSDoc, definições de tipo e retornos de chamada também são realçados corretamente e ficam disponíveis no preenchimento de código.
Além disso, todos os comentários JSDoc para símbolos estão disponíveis sobre usos desses símbolos no Pop-up de documentação rápida.
Assistência para expressão regular
O suporte para expressões regulares do ReSharper inclui a compreensão completa de expressões regulares JavaScript/TypeScript. Por padrão, expressões regulares são reconhecidas em literais de expressão regular, construtores e métodos RegExp, bem como em métodos de objetos String: match(), search(), replace(), split(). No entanto, você sempre pode instruir o ReSharper a analisar qualquer literal de string como uma expressão regular.
Refatorações
No código JavaScript e TypeScript, você pode aproveitar várias refatorações que funcionam da mesma forma que em C#: Inline Variable, Introduce Variable, Introduce Variable for Substring e Rename.
Em TypeScript, está disponível um conjunto de refatorações em tipos: Copy Type, Introduce Field, Move Type to Another File or Namespace e Move to Folder.
Há também uma refatoração específica para JavaScript/TypeScript: Move to Resource. Essa refatoração funciona em projetos JavaScript/TypeScript criados de modelos do Visual Studio (como o Apache Cordova) e permite mover literais de string para arquivos de recursos.
Todas as refatorações JavaScript/TypeScript também estão disponíveis na sintaxe JSX.
Criar a partir do uso
O ReSharper permite usar símbolos não existentes e, em seguida, gerar implementações apropriadas com base nesses usos em quase todas as linguagens com suporte. O JavaScript e o TypeScript não são exceções — para qualquer símbolo não resolvido, o ReSharper sugerirá uma ou mais maneiras de criá-lo.
Gerar construtores
Quando você pressiona Alt+Insert em uma declaração de tipo TypeScript, o ReSharper permite criar rapidamente um construtor para esse tipo. O assistente de geração de construtores cria um construtor não padrão que usa os campos selecionados do tipo e os tipos base como parâmetros.
Membros de implementação/substituição
Para tipos herdados, há dois recursos de geração de código relacionados:
- Implement missing members - implementa quaisquer membros de interface ou membros abstratos ausentes na classe atual;
- Override members - faz a mesma ação, mas também substitui membros virtuais, se aplicável.
Modelos de código
O ReSharper acompanha dezenas de modelos dinâmicos que abrangem todas as construções de código usadas com frequência em JavaScript e TypeScript. Também existem modelos postfix para TypeScript e JavaScript, além de modelos de arquivo para classes, interfaces e módulos TypeScript. É possível estender o conjunto padrão de modelos com modelos personalizados que você mesmo cria.
Assistência para estilo de código
O ReSharper ajuda você a manter automaticamente os dois pilares de estilo de código no código JavaScript e TypeScript: regras de formatação de código e convenções de nomenclatura.
Na verdade, a formatação de código funciona ainda melhor do que em C#: pressione Alt+Enter em um bloco de código selecionado e escolha para ver e configurar todas as regras de formatação que afetam o bloco selecionado.
Estão disponíveis preferências de estilo de código específicas para JavaScript e TypeScript: você pode manter o uso consistente de aspas simples (') ou duplas (") para lidar com literais de string e adicionar ou remover automaticamente o ponto-e-vírgula opcional de instruções.
Em TypeScript, você também pode controlar como especificar tipos em declarações (nome de tipo explícito, var ou any), se deseja usar o modificador public explicitamente e como importar módulos.
Todas as preferências de estilo de código JavaScript e TypeScript podem ser aplicadas em qualquer escopo com um único comando, usando correções rápidas ou o recurso de Limpeza de código.
Assistência para testes de unidades
O ReSharper ajuda a descobrir e executar testes de unidades com base em QUnit e Jasmine diretamente no Visual Studio. Você poderá selecionar qual navegador usar para executar seus testes JavaScript/TypeScript ou poderá optar por testes descentralizados com PhantomJS.
De maneira semelhante a testes de unidade do .NET, você pode procurar testes JavaScript/TypeScript na sua solução com o Unit Test Explorer, executá-los nessa janela, no Solution Explorer ou diretamente no editor, além de usar várias sessões de teste de unidade.
JSLint, ESLint e TSLint
O ReSharper estende as regras de análises de código incorporadas com suporte para três ferramentas de análise estáticas: JSLint, ESLint e TSLint. Todos esses linters ajudam a garantir que o código JavaScript e TypeScript seja legível e possa receber manutenção. Eles também permitem adicionar regras personalizadas, que podem ser incluídas em análises de código do ReSharper.
Caso um intérprete Node.js já esteja configurado na sua máquina, você poderá habilitar linters nas configurações do ReSharper, em Tools | Web Linters.
Auxiliares de valores JSON e catálogos de esquema
Auxiliares de valores JSON permitem que você instrua o ReSharper a fornecer preenchimento de código ou validação para seus próprios arquivos JSON. Você pode adicionar um auxiliar na página de opções JSON Value Helpers, fazendo correspondência com base em uma máscara de nome de arquivo e/ou correspondência de esquema. Catálogos de esquemas JSON personalizados também podem ser adicionados nas opções JSON.
Nota sobre atalhos
Todos os atalhos de teclado fornecidos nesta página estão disponíveis no mapa de teclas "Visual Studio" padrão do ReSharper. Para obter detalhes sobre os dois mapas de teclas do ReSharper, consulte a Documentação do ReSharper.