Po co oglądać AST

AST pokazuje strukturę kodu tak, jak rozumie ją parser TypeScript. To pomaga pisać reguły lintingu, codemody, generatory i narzędzia refaktoryzacyjne bez zgadywania po samym tekście.

Kod nie jest wysyłany na backend. TypeScript compiler API ładuje się po kliknięciu analizy i działa w aktualnej karcie.

Kod TypeScript

MVP parsuje TSX, pokazuje diagnostykę składniową i nie wykonuje kodu.

Wynik parsera

Brak wyniku

Kliknij Analizuj AST, aby zbudować drzewo dla aktualnego kodu.

Warto pamiętać

`pos` może obejmować komentarze i spacje; `getStart` zwykle wskazuje pierwszy właściwy token.

MVP parsuje jako TSX, więc JSX/TSX przechodzi przez tę samą ścieżkę compiler API.

Przy błędzie składniowym drzewo może istnieć, ale część node'ów wynika z odzyskiwania parsera.

Duże pliki są ograniczone, żeby nie blokować karty przeglądarki.

Compiler API, Babel czy regex

TypeScript compiler API

Najlepszy wybór, gdy potrzebujesz natywnego rozumienia składni TypeScript, diagnostics i `SyntaxKind`.

Babel parser

Świetny w ekosystemie transformacji JavaScript, ale ma inną reprezentację niż TypeScript compiler.

Regex/manual inspection

Szybkie do prostego wyszukiwania, ryzykowne dla refaktoryzacji i zmian strukturalnych.

FAQ

Czy kod jest wysyłany na serwer?

Nie. Parser działa w przeglądarce, a input użytkownika nie trafia do backendu.

Dlaczego `pos` i `start` są różne?

`pos` obejmuje często trivia, czyli komentarze i odstępy. `start` wskazuje początek właściwego tokena.

Czy mogę analizować TSX?

Tak. MVP tworzy source file jako TSX, więc JSX i dekoratory są obsługiwane przez compiler API.

Czy wynik jest tym samym co typy po type-checkingu?

Nie. To viewer składniowego AST i diagnostics parsera, a nie pełny program TypeScript z resolverem typów.

Do czego przydaje się compiler API snippet?

Pozwala odtworzyć traversal lokalnie i zacząć pisać regułę, codemod albo własne narzędzie analizy.

Zobacz AST TypeScript bez konfiguracji projektu