typescript 2.2.1

[doczoidberg]

    "@angular/cli": "1.0.0-rc.0",
    "@angular/compiler-cli": ">=4.0.0-beta <5.0.0",
    "@angular/language-service": ">=4.0.0-beta <5.0.0",
    "typescript": "~2.2.1"

vscode 1.9.1

is it possible to get it run with these versions?

[cyrilletuzi]

If you want to get ahead :
npm install typescript@next --save-dev

Then in your tsconfig.json :

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

Finally choose this last version of TypeScript (2.3) in VS Code (on bottom right), and restart as suggested.

Ta da. No need of the extension, and it will be amazingly faster, as it does not run a duplicate typescript process.

[doczoidberg]

How can I test?
I should go from html template to my variable definition via F12? this does not work.

[cyrilletuzi]

You'll see infos when over your components, autocomplete for properties binding, etc. But I'm working with inline templates, I didn't test with external templates yet.

[doczoidberg]

yes works with inline templates but not with external templates

[chuckjaz]

My plan is to use the new plugin architecture in 2.3 by default. This plugin would only then be required to get completions from external template references.

This should coincide around the time of the official 2.3 release.

[cyrilletuzi]

The first official release of this plugin (0.1.1) works only with TypeScript 2.1 and not with 2.2.

I think it should now be a bug to fix soon instead of an enhancement because angular/cli installs TS 2.2 by default, so the plugin is not compatible by default for many angular projects.

[chuckjaz]

I will be working on this next week. Unfortunately, many of the internal APIs to TypeScript changed significantly with 2.2 so the upgrade is not simple.

[fxck]

@chuckjaz any news on this? thank you

you only realise how big of a deal this plugin is when you can not use it

[chuckjaz]

@fxck I am working on it this week. I met with the TypeScript team last week and we came up with a better long-term strategy that is less likely to be broken as the TypeScript team is making changes. I am implementing my part this week.

[fxck]

@chuckjaz does that mean it will have to wait for a new version of typescript? Major? Minor?

[fxck]

https://blogs.msdn.microsoft.com/typescript/2017/04/27/announcing-typescript-2-3/ guess this is it

[chuckjaz]

@fxck Yes. 2.3 is the release we have been waiting for but it still doesn't have everything we need. I am coordinating with Microsoft, both the TypeScript and VSCode teams, regarding this. The changes necessary should be landing in the next couple of weeks.

My side has been implemented and is in Angular master. I have a PR for the the changes necessary for TypeScript out (tentatively slated for 2.3.2). The VSCode team is working on the changes to the TypeScript plugin that is necessary and most of which are currently in VSCode master. We need a subsequent change to handle external html files but that should also be landing in the next couple weeks.

Once all of this comes together I will update my plugin to use the new plugin architecture which will resolve most of this issues people have been having with the plugin as well as position the code to allow more features such as renaming references in templates.

[angelozerr]

We need a subsequent change to handle external html

@chuckjaz do you mean that TypeScript team should manage Plugin#getExternalFiles() https://github.com/Microsoft/TypeScript/blob/2150a7796b0dfe83c5286755410e0fd1646ed86c/src/server/project.ts#L270 It seems that you have implemented it https://github.com/angular/angular/blob/master/packages/language-service/src/ts_plugin.ts#L17 but TypeScript doesn't use it?

I post you this question because I try to integrates @angular/language-service inside Eclipse with TypeScript Plugins. It works great with @Component/template inside a TypeScript file but not when template is declared in html file.

Thanks for your answer.

[chuckjaz]

@angelozerr Correct.I have a PR pending to TypeScript that enables it and we are working through the details of landing it. Once that is landed the TypeScript service will handle request for external templates.

However, it is an exercise for the integrator how to get the editor to direct in html files requests to TypeScript.

The current plans for VSCode is for TypeScript extensions to be able to add file types which should be handled by the TypeScript service. This plugin then would become a VSCode TypeScript plugin that would add html files to that list along with registering @angular/language-service as a TypeScript global extension.

[angelozerr]

Thanks so much for your great explanation.

The current plans for VSCode is for TypeScript extensions to be able to add file types which should be handled by the TypeScript service.

You mean, when an html file is opened, it should consumes tsserver commands like open, change for HTML file like for TypeScript file?

with registering @angular/language-service as a TypeScript global extension.

I have seen that now TypeScript provides global plugin, but I don't understand how it works. For the moment I declare TypeScript plugins like your @angular/language-service and my tslint-language-service in the plugins section of tsconfig.json and it requieres having @angular/language-service in the node_modules of the project.

Global plugins gives the capability to register a plugin without installing in your project, is that?

[chuckjaz]

You mean, when an html file is opened, it should consumes tsserver commands like open, change for HTML file like for TypeScript file?

Yes.

Global plugins gives the capability to register a plugin without installing in your project, is that?

Yes. The global plugins are loaded in addition to the ones listed in the config file.

[angelozerr]

Thanks so much to have taken time to give me answer.

I will track TypeScript work to test that, I'm so very enthousiasm with your work and integrate it inside Eclipse:)

[kukjevov]

Hi @chuckjaz Typescript 2.3.3 was released today. Are your PRs present in this version? Will you be able to finish that integration into TsServer?

Thank you for great work :)

[chuckjaz]

It is not. There are some issues we found in the design fairly late and they have yet to work through them completely.

[fxck]

So it was merged just now. Hopefully coming with the nest minor release.

[angelozerr]

@chuckjaz I'm trying to consume "definition" tsserver command inside Eclipse from HTML angular template app.component.html:

<h1>
  {{title}}
</h1>

to retrieve definition of title property declared in a TypeScript file

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app works!';
}

with :

• @angular/language-service@4.2.0-rc.2 which implements getExternalFiles
• typescript@2.4.0-dev.20170606 which defines getExternalFiles

In my HTML editor I consumes the same commands than tsserver like open, change, etc commands, but it doesn't work. When you will have time please tell me which tsserver commad, an editor must consumes (ex: pass a particulary skriptKing 'html' when an HTML editor is opened?) Thanks!

[chuckjaz]

I don't know what could be wrong as this is one of the tests I run to validate the language service works.

One thing you could try is opening app.component.ts first and see if that helps.

What getExternalFiles does is allow tsserver to query a plugin to calculate a list of external files to include in a project that is associated with a particular tsconfig.json file. If the .html file is not associated with an angular project, the .html file will be treated as a loose .ts file.

[angelozerr]

@chuckjaz sorry for the noise, it was my fault, it works great now, here a little demo with @angular/language-service with Eclipse and HTML editor:

It works great! Many thank's for your great work!

[kukjevov]

@chuckjaz @angelozerr
Guys does this mean, that with Angular 4.2.0 and Typescript 2.4.0 this extensions for VSCode will be obsolete and it will work in VSCode or any editor that can work with typescript TSServer using just typescript plugin?

[chuckjaz]

There will still be a Angular plugin for VSCode but it will change considerably. Instead of having its own server it will register with VSCode that @angular/language-service is a valid TypeScript plugin and provide a default plugin if the project doesn't include one.

The @angular/language-service plugin will work in any context that TypeScript runs in a node instance (this, at least for now, excludes Visual Studio proper). However, for completions to work in a external .html file, as demonstrated by @angelozerr above, requires the editor know to direct requests from the .html file to tsserver which is going to be different for each editor (and is, why the Angular plugin for VSCode is still necessary).

[kukjevov]

Hi @chuckjaz, it looks like that Typescript 2.4 RC is out and Angular 4.2.2 is also out :). Would it be possible to try to update plugin to these latest changes :). Maybe now it will work as it should :).

I just look forward for this awesome plugin :).

Thank you

[chuckjaz]

Updating past 2.1 is challenging with the existing architecture as there were some internal changes to TypeScript that broke my server. However, the TypeScript plugin architecture makes this moot and I am working to move to that but it is taking longer than I thought.

I will update the language service bundled with the 2.1 based server early next week if I cannot get all the pieces to land together for the new architecture.

[chuckjaz]

Fixed in 0.1.4

[angelozerr]

If the .html file is not associated with an angular project, the .html file will be treated as a loose .ts file.

@chuckjaz I have a problem about that I think. Indeed when I open an HTML file which is not linked to an Angular Template, my HTML file is considered as a TypeScript file and semanticDiagnosticsSync returns TypeScript errors (my HTML have a lot of errors) and don't consume the semanticDiagnosticsSync of the Angular language service plugin. Is it a problem that you have though? Perhaps my integration is bad?

Thanks for your help!

[chuckjaz]

This is the reason I haven't converted over to the new plugin architecture yet. The TypeScript team is working with the VS Code team to resolve this.

The safest thing is to ask the Angular language service which files are templates and only request information from tsserver when this is true. There is no existing protocol for this, however, The solution Microsoft is working on is passing the kind of the file along with this request allowing the server to determine if the file should be treated as a TypeScript file.

[angelozerr]

As usually, many thanks for your great info! Thanks @chuckjaz !

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}