Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
TypeScript plugins
Search
Yosuke Kurami
April 28, 2017
Programming
0
1.7k
TypeScript plugins
Introduce how to use and create TypeScript LS plugins
Yosuke Kurami
April 28, 2017
Tweet
Share
More Decks by Yosuke Kurami
See All by Yosuke Kurami
Next.js App Router
quramy
15
2.6k
Fragment Composition of GraphQL
quramy
15
2.3k
reg-viz VRT tools
quramy
4
1.1k
NoInfer
quramy
0
140
Precondition with schema directives
quramy
0
1.2k
T3 Stack and TypeScript ecosystem
quramy
4
1.8k
apollo client / react / esm
quramy
1
240
Apollo Client useFragment
quramy
2
940
About Type Syntax Proposal
quramy
1
1.9k
Other Decks in Programming
See All in Programming
Introduction to GitOps
hwchiu
0
110
Namespace on read
tagomoris
2
370
CSC307 Lecture 09
javiergs
PRO
1
500
Prompt FlowによるLLMアプリケーション開発
yuto2000
1
1k
大規模マルチテナントを解決するYugabyteDBという選択肢
nnaka2992
1
250
Async Await: Mastering Python's Time-Bending Tricks - EuroPython2024
yanbo
1
290
AWS CDKにおける「再利用性」を考える / aws-cdk-reusability
gotok365
6
1.3k
APIのない大学ログインWebサービスをWKWebViewとJavaScriptでアプリ化した話
akidon0000
1
330
Harnessing Large Language Models for Training-free Video Anomaly Detection
tereka114
1
1.3k
3 Effective Rules for Success with Signals in Angular
manfredsteyer
PRO
0
120
英語
s_shimotori
1
220
Activities at Cairo Library
cairolibrary720
0
1.2k
Featured
See All Featured
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
29
2.5k
Creatively Recalculating Your Daily Design Routine
revolveconf
214
11k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
44
4.7k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
26
2.1k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
245
1.2M
Documentation Writing (for coders)
carmenintech
63
4.2k
Adopting Sorbet at Scale
ufuk
71
8.8k
Learning to Love Humans: Emotional Interface Design
aarron
269
39k
Into the Great Unknown - MozCon
thekraken
20
1.3k
Web development in the modern age
philhawksworth
203
10k
Rails Girls Zürich Keynote
gr2m
93
13k
Intergalactic Javascript Robots from Outer Space
tanoku
266
26k
Transcript
TypeScript Plugin 2017.04.28 Meguro.es x Gotanda.js
About me • @Quramy (Yosuke Kurami) • Frontend Web Developer
at WACUL INC. • develop SPA with TypeScript and Angular • झຯͰTypeScript༻ͷVimϓϥΪϯ։ൃͯ͠·͢ • http://vimawesome.com/plugin/tsuquyomi
Today’s theme: new TypeScript feature
TypeScript 2.3 is coming https://blogs.msdn.microsoft.com/typescript/2017/04/27/announcing-typescript-2-3/
New feature: Plugin support
How to use plugins { "compilerOptions": { "module": "commonjs", "target":
"es5", "strict": true, "sourceMap": false, "plugins": [ { "name": "hoge-plugin" }, { "name": "foo-plugin" } ] } } • tsconfig.jsonʹpluginsΛࢦఆ͢Δ • node_modules͔ΒಡΈ͜·ΕΔ
Plugin͕Ͱ͖Δ͜ͱ • PluginLanguage ServiceΛproxy͢Δ • τϥϯεύΠϧͷڍಈมߋͰ͖ͳ͍ • https://github.com/Microsoft/TypeScript/issues/14419
Language Service in TS
Language Service in TS
What’s Language Service • ΤσΟλɾIDEʹछʑͷݴޠใΛఏڙ͢Δ • ฤूதιʔείʔυͷΤϥʔɺิɺetc • Language ServiceΛ֦ுͰ͖Δͱ͍͏͜ͱ
ɺछผΛΘͣΤσΟλ͕ڗड͢ΔػೳΛ ֦ுͰ͖Δɺͱ͍͏͜ͱ
(ࢀߟ) LSP https://github.com/Microsoft/language-server-protocol
༇շͳؒͨͪ
Plugins: • Angular: ςϯϓϨʔτͷิ, ΤϥʔνΣοΫ, etc… https://github.com/angular/angular • Vue.js: Single
File Components αϙʔτ https://github.com/sandersn/vue-ts-plugin • tslint: tslintΤϥʔͷՃ https://github.com/angelozerr/tslint-language-service • CSS Modules: .cssϑΝΠϧͷղܾ https://github.com/HerringtonDarkholme/ts-css-plugin • GraphQL: GraphQLΫΤϦͷิɺΤϥʔνΣοΫ https://github.com/Quramy/ts-graphql-plugin
·ͩ·ͩগͳ͍….
࡞Ζ͏ʂ
Let’s create LS plugins import * as ts from 'typescript/lib/tsserverlibrary';
function create(info: ts.server.PluginCreateInfo) { const ls = info.languageService; // extend ls object... return ls; } const factory: ts.server.PluginModuleFactory = () => { return { create }; } export = factory;
How to create LS plugins • ඞཁͳܕఆٛ typescript/lib/tsserverlibrary ͔Β import
• create: (info) => ts.LanguageService Λ࣮͢Δ • ඞཁʹԠͯ͡ languageService ͷϝιουΛ্ॻ͖͢Δ • ؆୯ʂ
Thank you !