TypeScript Language Service - Paris TypeScript March 2019

Just a little summary about TypeScript Language Service Extension plugin

Follow me on twitter: @lsagetlethias / @Wynd_tech
https://twitter.com/lsagetlethias
https://twitter.com/Wynd_tech (We're hiring!)

Original slides: https://docs.google.com/presentation/d/1O2dw4i-JIg9lFkScjKeJWnJpVWbmUNL8yllUh68kW4k/edit?usp=sharing

Video of the talk: https://youtu.be/3PuXzqO7_Zw

Transcript

1. @lsagetlethias TypeScript Language Service Extension Because TS is not only about types.
2. @lsagetlethias Hi! Lilian Saget-Lethias Front Architect @lsagetlethias @Wynd_tech 2
3. @lsagetlethias 3 Compiler != Language Service Brief history Who use it and why? Your turn!
4. @lsagetlethias Compiler != Language Service 4
5. @lsagetlethias 5
6. @lsagetlethias 6 The "Language Service" exposes an additional layer around the core compiler pipeline that are best suiting editor-like applications. TypeScript Language Service Plugins are for changing the editing experience only. The core TypeScript language remains the same. Quick def “ ”
7. @lsagetlethias 7 ➔ Add new custom syntax to TypeScript ➔ Change how the compiler emits JavaScript ➔ Customize the type system to change what is or isn't an error when running tsc What LS cannot do
8. @lsagetlethias 8 ➔ Provide errors from a linter inline in the editor ➔ Filter the completion list to remove certain properties from window ➔ ... What LS can do
9. @lsagetlethias 9 Completion filtering e.g.
10. @lsagetlethias 10 ➔ ... ➔ Redirect "Go to definition" to go to a different location for certain identifiers ➔ Enable new errors or completions in string literals for a custom templating language (tagged template) ➔ ... What LS can do
11. @lsagetlethias 11 Template string autocomplete e.g.
12. @lsagetlethias 12 ➔ ... ➔ Add custom colors in template string with vscode libraries ➔ Customize quick info toolbox from specific conditions What LS can do
13. @lsagetlethias Brief History 13
14. @lsagetlethias 14 [1.4 - Jan 2015] LS Introduced [2.0 - Summer 2016] Completed - Angular team request [2.2 - Feb 2017] Finalized [2.3 - Apr 2017] Officialized [.] First plugins starts to show up Language Service API
15. @lsagetlethias 15 [2014] - Compiler mechanism exposed [2017] - Transformer API exposed [2018] - ttypescript is out [2018-?] - PR are coming for various features (like incremental watch compilation) Compiler API & Transformer
16. @lsagetlethias Who use it & why? 16
17. @lsagetlethias 17 /Microsoft/typescript-tslint-plugin /Quramy/ts-graphql-plugin /Microsoft/typescript-styled-plugin /angular/angular /Microsoft/typescript-lit-html-plugin
18. @lsagetlethias 18
19. @lsagetlethias 19
20. @lsagetlethias Your turn! 20
21. @lsagetlethias 21
22. @lsagetlethias 22 { "compilerOptions": { "plugins": [{ "name": "@paris-ts/typescript-awesome-plugin" }] } }
23. @lsagetlethias 23 ➔ https://github.com/bios21/ts-plugin ➔ https://github.com/RyanCavanaugh/sample-ts-plugin ➔ Official Wiki https://github.com/Microsoft/TypeScript/wiki/Writing-a-Language-Service-Plugin Links
24. @lsagetlethias 24 ➔ Angular LS request: https://github.com/Microsoft/TypeScript/issues/6508 ➔ PR for LS from Wesley Wigham https://github.com/Microsoft/TypeScript/pull/10160 ➔ Proposal “Type Relationship API” https://github.com/Microsoft/TypeScript/issues/9879 ➔ Complete Extension target https://github.com/Microsoft/TypeScript/pull/903 ➔ https://github.com/cevek/ttypescript ➔ https://github.com/Quramy/ts-graphql-plugin ➔ https://github.com/Microsoft/typescript-styled-plugin ➔ https://devblogs.microsoft.com/typescript/announcing-typescript-2-3/#language-ser ver-plugin-support ➔ https://ts-ast-viewer.com/ Links
25. @lsagetlethias Questions? 25
26. 26 Thanks