Vscode-ng-language-service: Não funciona com modelo HTML angular e código VS

Criado em 22 jan. 2018  ·  41Comentários  ·  Fonte: angular/vscode-ng-language-service

Não tenho certeza do que estou fazendo de errado, mas não consigo obter suporte da intellisense ou do editor para modelos Angular HTML com VS Code depois de instalar este modelo. Simplesmente não funciona. Também não vejo nenhum código de cores ou intellisense, tudo é digitado à mão como no bloco de notas agora para mim com modelos HTML angulares.

bug

Comentários muito úteis

Estou usando o Angular CLI v1.6.4
Serviço de Angular Language: 5.2.1
TypeScript: 2.6.2

Até dois dias atrás, eu tinha intellisense e links de referência de arquivo em meus modelos HTML. Essa funcionalidade parece estar faltando agora. Acho que a versão mais recente está causando algum problema com minha configuração atual (vi que a extensão foi atualizada automaticamente recentemente)

Todos 41 comentários

@jontiefer você deu uma olhada na seção de saída do VS Code? Lá você deve encontrar logs do plugin Language-Service, que pode dar mais detalhes sobre o seu caso.

Relacionado: # 214

Você pode tentar a solução alternativa mencionada no item 214?

Estou usando o Angular CLI v1.6.4
Serviço de Angular Language: 5.2.1
TypeScript: 2.6.2

Até dois dias atrás, eu tinha intellisense e links de referência de arquivo em meus modelos HTML. Essa funcionalidade parece estar faltando agora. Acho que a versão mais recente está causando algum problema com minha configuração atual (vi que a extensão foi atualizada automaticamente recentemente)

Tentei a solução alternativa no # 214 e não pareceu mudar nada. Talvez eu tenha feito errado? Não vi a versão do Angular Language Service mudar nas duas vezes em que me cansei de executá-lo. Acabei de executar yarn remove @angular/language-service e, em seguida, fechei o VSCode e o reabri novamente.

Aqui está o que eu recebo recentemente abrindo VSCode em um arquivo html e, em seguida, tentando pairar sobre um nome de variável preenchido pela metade:

Search path: c:/git/PrimeCore/Prime.Core/ClientApp/app/vendor/tool-view
Config file name: c:/git/PrimeCore/Prime.Core/tsconfig.json
Angular Language Service: 5.2.1
TypeScript: 2.6.2
getTemplateReferences: 3446ms
Add recursive watcher for: c:/git/PrimeCore/Prime.Core
Opened configuration file c:/git/PrimeCore/Prime.Core/tsconfig.json
getTemplateReferences: 0ms
Angular Language Service: 5.2.1
TypeScript: 2.6.2
getTemplateReferences: 27ms
getDiagnostics: 4ms
getHoverAt: 0ms
getHoverAt: 1ms

depois disso, getHoverAt e getCompletions sempre leva 0 ms e não dá nenhuma opção.

@rfuhrer Você executou yarn install após yarn remove para atualizar os node_modules? Talvez yarn clean cache . Parece que o serviço de idioma ainda está presente.
Há uma nova atualização do VSCode lançada hoje - veremos se isso faz alguma diferença

Você não tem que fazer yarn install ou yarn cache clean depois de remover algo, pois o fio realmente mantém seus node_modules limpos e atualizados. Verifiquei duas vezes e a pasta do serviço de idioma estava faltando após a remoção e reapareceu após eu adicioná-la novamente.
Também estou executando a versão de hoje do VSCode.

Parece que há apenas algum tipo de desconexão entre o HTML e o .ts porque você pode ver o serviço de linguagem fazendo coisas enquanto está dentro de um arquivo .ts e está mostrando todas as coisas legais do Intellisense:

Search path: c:/git/PrimeCore/Prime.Core/node_modules/@angular/material/dialog/typings
Config file name: c:/git/PrimeCore/Prime.Core/tsconfig.json
getTemplateReferences: 0ms
getTemplateReferences: 0ms
getTemplateReferences: 0ms
getCompletions: 1ms
getDiagnostics: 0ms
getHoverAt: 0ms
getHoverAt: 1ms
getCompletions: 0ms

Você já tentou fazer isso com 0.1.8 da extensão?

220 deve abordar este problema.

Sim, ele atualizou automaticamente a extensão como @briancodes mencionado. Eu poderia tentar instalá-lo manualmente com o VSIX, mas diz 0,18 na tela de extensão

O fato de Angular Language Service: 5.2.1 ser impresso duas vezes é uma indicação de que um segundo projeto foi criado para a solicitação. É um sinal de que o serviço de linguagem não percebeu que o arquivo .html foi referenciado pelo projeto.

Qual é o templateUrl você está usando? O projeto é compilado de forma limpa no AOT?

@briancodes Você pode produzir um projeto que eu possa clonar que reproduza isso?

O mesmo aqui, após a atualização para 0.1.8, ele parou de funcionar em .html arquivos. Vou tentar descobrir qual é o problema :).

Também está quebrado para mim:

Angular Language Service: 5.2.1
TypeScript: 2.6.2

Eu apliquei a solução alternativa # 214, mas ainda não funciona.

@chuckjaz Hi. Eu criei um novo projeto com as versões CLI e Angular mais recentes (atualizado para a CLI estável mais recente lançada hoje). Também tem a última versão estável do VSCode

https://github.com/briancodes/language-ext-issue217

Eu coloco os detalhes do que está ocorrendo no arquivo README.md

Nota: Eu adicionei um branch remove-angular-language-service onde fiz um npm uninstall @angular/language-service . Fez um npm cache verify , npm install e reiniciou o VSCode.

  • projeto usa Typescript "typescript": "~2.5.3" por padrão
  • A versão do TypeScript do VSCode é 2.6.2, então atualizei o projeto para usar também 2.6.2 (mesmo resultado)
  • Projeto Angular alterado e VSCode para usar TypeScript v2.5.3 (mesmo resultado)

Serviço de Angular Language: 5.2.1
Versão da extensão: 0.1.8
Versão do TypeScript: 2.4.2, 2.6.2, 2.5.3, 2.7.0-insider

Todos falharam ...... emergência, não poderia funcionar sem ele!

0.1.8 também não está funcionando para mim em modelos HTML com Angular 5.2.2, TypeScript 2.6.2 e VS Code 1.19.3.

Minha solução alternativa atualmente é reverter vscode-ng-language-service para 0.1.7 encontrado aqui: https://github.com/angular/vscode-ng-language-service/releases/tag/0.1.7

Posso confirmar que reverter para 0.1.7 fez tudo funcionar corretamente novamente, apesar de estar na última versão do angular, typescript e VSCode

@briancodes Eu clonado https://github.com/briancodes/language-ext-issue217 e funciona para mim.

Suspeito que pode ser um problema com caminhos no Windows, então estou tentando isso agora.

Por interesse, @ryanbuening , qual é o processo para reverter uma extensão? Suponho que não seja compatível com o VSCode fora da caixa

@briancodes revert,

Tenho certeza que é apenas um erro / vs \ estúpido ou algo igualmente irritante graças ao caminho incrível do Windows

@briancodes eu reproduzi isso no Windows. Investigando agora.

Por interesse, @ryanbuening , qual é o processo para reverter uma extensão? Suponho que não seja compatível com o VSCode fora da caixa

@briancodes Você precisa desativar as extensões de atualização automática e, em seguida, selecionar Instalar do VSIX ...

image

É um problema de caminho e uma mudança aparente no TypeScript que eu não conhecia.

Passamos o resultado de path.join() diretamente para o TypeScript ao inicializar o compilador que deveríamos chamar path.posix.join() .

Uma solução temporária é mudar a linha:

containingFile = path.join(this.options.basePath, 'index.ts');

para:

containingFile = path.posix.join(this.options.basePath, 'index.ts');

no arquivo language-service.umd.js no pacote @angular/language-service .

Farei essa alteração em @angular/language-service e atualizarei a extensão.

@briancodes @jontiefer @ryanbuening Pode um de vocês (ou qualquer outra pessoa no tópico) testar https://github.com/angular/vscode-ng-language-service/releases/tag/0.1.9 no Windows usando seus projetos?

Acredito que isso corrige o problema do Windows conforme descrito acima.

@chuckjaz Grande sucesso!
image

@rfuhrer Obrigado!

@chuckjaz Eu não percebi o quanto confiava nesta extensão de linguagem até que ela parou de funcionar :-) Ótimo trabalho

Coisa boa! Lição aprendida: da próxima vez, mencionarei que estou no Windows ao fazer um comentário.

Tendo esse mesmo problema novamente.
Plataforma: Windows

PS C:\Dev\Programming\Ang5Tutorial\angular-tour-of-heroes> npm list @angular/language-service
[email protected] C:\Dev\Programming\Ang5Tutorial\angular-tour-of-heroes
`-- @angular/[email protected]

PS C:\Dev\Programming\Ang5Tutorial\angular-tour-of-heroes> npm list typescript
[email protected] C:\Dev\Programming\Ang5Tutorial\angular-tour-of-heroes
+-- @angular/[email protected]
| +-- @angular-devkit/[email protected]
| | `-- [email protected]
| `-- @schematics/[email protected]
|   `-- [email protected]
`-- [email protected]

PS C:\Dev\Programming\Ang5Tutorial\angular-tour-of-heroes>

Talvez eu tenha errado?

Talvez eu não tenha entendido como esse plugin deve ser usado.
Mas acabei de ver na guia Contribuições que as extensões de arquivo para um 'modelo angular' são .ng , .ngml e .ng.html .
Quando mudei a extensão do meu arquivo de template de .html para .ng.html, o idioma mudou para AngularTemplate e comecei a receber valores no intelisense que antes não recebia. por exemplo: * ngIf, * ngFor e as propriedades do componente. Além disso, agora posso clicar com crtl em eventos ou métodos e ser redirecionado para o arquivo .ts.
Mas eu perco as cores das etiquetas.

Agora está funcionando. Apenas certifique-se de que não há erros de TypeScript que eram problema em meu caso de uso

https://github.com/Hotell/react-tools-for-better-angular-apps/pull/2

isso pode ser fechado @chuckjaz ?

obrigado!

@michaeljmonte após alterar a versão do typescript igual à do vscode; ou mude "typescript.tsdk" para "./node_modules/typescript/lib" , o plugin funcionará novamente; Espero que isso possa ajudar-lhe

Ainda não funciona no Mac desde Angular 6 ...

Tentei instalar a extensão manualmente, mas não funcionou com meu projeto agora:
Angular 6 e texto datilografado 2.7.2

Existe alguma solução para esse problema porque preciso desse trabalho como antes?

Mesmo aqui, a conclusão não funciona no vscode para ng new app .

  • Angular 6.1.9
  • Datilografado 2.7.2

Mesmo, não está funcionando.

  • Ubuntu 18.04 (x64)
  • CLI Angular: 6.1.5
  • Nó: 10.6.0
  • Texto datilografado 2.9.2

Gostaria de saber se a extensão ainda foi atualizada? O último commit foi há 2 meses (ok, ainda não está desatualizado;)), mas este problema já existe há cerca de 10 meses e parece ser bastante crítico.

Não funciona para mim em arquivos HTML, sem conclusão, sem ir para

  • Angular 7.0.3
  • Texto datilografado 3.1.6
  • Extensão do código VS: 0.1.10

editar: Ok, conforme:
https://angular.io/guide/language-service#installing -in-your-project

Eu adicionei

"plugins": [ {"name": "@angular/language-service"} ]

ao meu tsconfig. As coisas parecem ter começado a funcionar (embora ele gaste muito tempo e a CPU contínua inicializando seus recursos de linguagem, espero que seja um).

Eu também tive esse problema, mas finalmente descobri que defini a sintaxe errada no arquivo .html (eu havia definido wxml).
então mudei a sintaxe e funcionou.

tente, pode ser resolvido

VSCode - Configurações do usuário

"editor.snippetSuggestions": "top",

para

"editor.snippetSuggestions": "inline",

Fechando isso, já que o problema foi resolvido em https://github.com/angular/vscode-ng-language-service/issues/217#issuecomment -360890538

Este problema foi bloqueado automaticamente devido à inatividade.
Registre um novo problema se você estiver encontrando um problema semelhante ou relacionado.

Leia mais sobre nossa política de bloqueio automático de conversas .

_Esta ação foi executada automaticamente por um bot._

Esta página foi útil?
0 / 5 - 0 avaliações