Upgrade to Pro — share decks privately, control downloads, hide ads and more …

ts-morphで簡単に始めるAST操作 / ast-manipulation-with-ts...

Avatar for aose aose
October 30, 2024
Technology
0
1.2k

ts-morphで簡単に始めるAST操作 / ast-manipulation-with-ts-morph

簡単に始めるシリーズ第二弾として、TypeScriptにおけるASTをあまり知らない方や、まだ触ったことがない方に向けて、簡単にできるASTの操作・ライブラリについてご紹介します。

Avatar for aose

aose

October 30, 2024
Tweet

More Decks by aose

See All by aose
alien-signals と自作 OSS で実現する フレームワーク非依存な ロジック共通化の探求 / Exploring Framework-Agnostic Logic Sharing with alien-signals and Custom OSS
Avatar for aose aoseyuu
4
7.2k
UnJSで簡単に始めるCLIツール開発 / cli-tool-development-with-unjs
Avatar for aose aoseyuu
2
950

Other Decks in Technology

See All in Technology
When an innocent-looking ListOffsets Call Took Down Our Kafka Cluster
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
120
非情報系研究者へ送る Transformer入門
Avatar for Ryo Ishiyama rishiyama
9
6.7k
Kaggleの経験が実務にどう活きているか / kaggle_findy
Avatar for Sansan R&D sansan_randd
7
1.3k
「Blue Team Labs Online」入門 - みんなで挑むログ解析バトル
Avatar for Noriaki Hayashi v_avenger
0
130
Dr. Werner Vogelsの14年のキーノートから紐解くエンジニアリング組織への処方箋@JAWS DAYS 2026
Avatar for Hiroshi Hayakawa (p0n) p0n
1
120
メタデータ同期に潜んでいた問題 〜 Cache Stampede 時の Cycle Wait を⾒つけた話
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
150
事例に見るスマートファクトリーへの道筋〜工場データをAI Readyにする実践ステップ〜
Avatar for 濱田孝治 hamadakoji
1
270
20260305_【白金鉱業】分析者が地理情報を武器にするための軽量なアドホック分析環境
Avatar for Yuya Kaneta yucho147
2
220
僕、S3 　シンプルって名前だけど全然シンプルじゃありません　よろしくお願いします
Avatar for Yuuki Yamashita yama3133
1
150
開発組織の課題解決を加速するための権限委譲 -する側、される側としての向き合い方-
Avatar for daitasu daitasu
5
470
聲の形にみるアクセシビリティ
Avatar for tomokusaba tomokusaba
0
160
Syncでつながるアジャイル 部署の壁を越えて進化し続けるチームづくり / Agile practices connecting and syncing beyond departmental boundaries
Avatar for 三菱UFJインフォメーションテクノロジー株式会社 muit
0
100

Featured

See All Featured
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
Avatar for Helen Beal helenjbeal
1
140
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.3k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k
AI Search:
Where Are We & What Can We Do About It?
Avatar for Aleyda Solis aleyda
0
7.1k
Joys of Absence: A Defence of Solitary Play
Avatar for Sebastian Deterding codingconduct
1
300
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1370
200k
30 Presentation Tips
Avatar for Ian Lurie portentint
PRO
1
250
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.4k
Paper Plane (Part 1)
Avatar for Katie Cordina Lindsey katiecoart
PRO
0
5.4k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
40
2.3k
Music & Morning Musume
Avatar for Bryan Veloso bryan
47
7.1k

Transcript

  1. ts-morphで簡単に始めるAST操作

  2. Speaker 株式会社ヤプリ フロントエンドエンジニア 青木 優弥 / Aose Yuu • 2023/11〜

    ヤプリjoin 来月からヤプリ2年目突入 • Vue Fes ボランティアスタッフ
  3. None
  4. None

  5. ASTとは？

  6. AST ↕ 抽象構文木

  7. 抽象構文木（AST：Abstract Syntax Tree） • プログラムのソースコードを階層的に表現するデータ構造 • ツリー構造で、各ノードがプログラムの構成要素を表す • ノード同士の親子関係＝ソースコードの構造的な関係

  8. None

  9. 󰷺󰷺󰷺󰷺󰷺 󰷺

  10. ASTでできること • コードの解析（Linter, Formetter） • コードの変換・生成 • リファクタリング

  11. ASTでできること • コードの解析（Linter, Formetter） • コードの変換・生成 • リファクタリング 　　　　　　　　　 ⬇

    気合いの正規表現🔥　漢の文字列置換💪　からの卒業󰠈

  12. 󰷺󰷺󰷺󰢄󰷺 󰷺󰷺

  13. ts-morphとは？

  14. ts-morph ↕ TypeScript Compiler APIの ラッパーライブラリ

  15. 超簡単な例

  16. None
  17. None
  18. None

  19. 🤮

  20. None

  21. 🥰

  22. None

  23. ts-morphを使った実例 vuex → pinia：簡単＆部分的な例

  24. None
  25. None
  26. None
  27. None
  28. None
  29. None

  30. ts-morphを使って AST操作を簡単に始めよう！