Wyjaśnienie kompilacji TypeScript Jak kompilować i uruchamiać kod

TypeScript to statycznie typowany superzbiór JavaScript, który kompiluje się do zwykłego JavaScript. Aby skutecznie używać TypeScript, kluczowe jest zrozumienie procesu kompilacji. Ten przewodnik przeprowadzi Cię przez podstawy kompilacji i uruchamiania kodu TypeScript, od konfiguracji do wykonania.

Zrozumienie kompilacji TypeScript

Kod TypeScript nie jest bezpośrednio wykonywany przez przeglądarki ani Node.js. Zamiast tego musi zostać skompilowany do JavaScript. Kompilator TypeScript, `tsc`, wykonuje to zadanie. Proces obejmuje konwersję plików TypeScript (`.ts`) do plików JavaScript (`.js`), które można uruchomić w dowolnym środowisku JavaScript.

Konfigurowanie środowiska TypeScript

Zanim będziesz mógł skompilować kod TypeScript, upewnij się, że masz zainstalowane Node.js i npm. TypeScript możesz zainstalować globalnie za pomocą npm:

npm install -g typescript

To polecenie instaluje kompilator TypeScript (`tsc`) globalnie, dzięki czemu będzie on dostępny z dowolnego miejsca w systemie.

Kompilacja kodu TypeScript

Aby skompilować plik TypeScript, przejdź do katalogu projektu w terminalu i użyj polecenia `tsc`, a następnie nazwy pliku:

tsc filename.ts

Zastąp `filename.ts` nazwą swojego pliku TypeScript. To polecenie kompiluje kod TypeScript do pliku JavaScript o tej samej nazwie, ale z rozszerzeniem `.js`.

Korzystanie z pliku konfiguracyjnego TypeScript

Plik `tsconfig.json` służy do konfigurowania opcji kompilatora TypeScript i ustawień projektu. Możesz wygenerować ten plik za pomocą:

npx tsc --init

Oto przykład podstawowego pliku `tsconfig.json`:

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "strict": true,
    "outDir": "./dist",
    "sourceMap": true
  },
  "include": [
    "src/**/*"
  ],
  "exclude": [
    "node_modules"
  ]
}

Ta konfiguracja określa, że ​​TypeScript powinien kompilować kod do ECMAScript 6 (`es6`), używać modułów CommonJS, włączać ścisłe sprawdzanie typów, wyprowadzać skompilowane pliki do katalogu `dist` i generować mapy źródłowe do debugowania.

Kompilowanie wszystkich plików w projekcie

Mając plik `tsconfig.json`, możesz skompilować wszystkie pliki TypeScript w swoim projekcie, uruchamiając:

tsc

To polecenie odczytuje plik `tsconfig.json` i kompiluje wszystkie pliki TypeScript określone w konfiguracji.

Uruchamianie skompilowanego kodu JavaScript

Po skompilowaniu kodu TypeScript do JavaScript możesz go uruchomić za pomocą Node.js lub uwzględnić w projekcie internetowym. Aby uruchomić plik JavaScript za pomocą Node.js, użyj:

node dist/filename.js

Zastąp `filename.js` nazwą skompilowanego pliku JavaScript znajdującego się w katalogu `dist`.

Typowe błędy kompilacji

Podczas kompilacji możesz napotkać błędy. Oto kilka typowych problemów i sposobów ich rozwiązania:

• Błędy składniowe: Sprawdź kod TypeScript pod kątem problemów składniowych. Kompilator wyświetli komunikaty o błędach wskazujące, gdzie występują problemy.
• Błędy typu: Upewnij się, że Twój kod jest zgodny z systemem typów TypeScript. Przejrzyj adnotacje typów i upewnij się, że są poprawnie zdefiniowane.
• Problemy z konfiguracją: Sprawdź, czy plik `tsconfig.json` jest poprawnie skonfigurowany i znajduje się w katalogu głównym projektu.

Wniosek

Kompilacja kodu TypeScript jest podstawowym krokiem w procesie rozwoju. Rozumiejąc, jak skonfigurować środowisko, skonfigurować kompilator i obsługiwać typowe błędy, możesz skutecznie konwertować kod TypeScript na JavaScript i uruchamiać go w różnych środowiskach. Ta wiedza pomoże Ci w pełni wykorzystać funkcje TypeScript i ulepszyć przepływ pracy deweloperskiej.