Memulai Project TypeScript

by

Untuk memulai project typescript, sama seperti Anda akan memulai project web app umumnya.

Buat direktori untuk project, Pada tutorial digunakan nama typescr. Lalu buka folder dari text editor.

Tambahkan file index.html, isi dengan template sederhana untuk memanggil css yang Anda inginkan dan memanggil file javascript hasil kompilasi dari TypeScript.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <title>SkillPlus TypeScript Dasar</title>
</head>
<body>
    <div id="container" class="container">        
    </div>
    <script type="text/javascript" src="app.js"></script>
</body>
</html>

Kemudian buat file app.ts untuk code typescript yang akan kita buat.

Coba tambahkan code dibawah

var todo: string = "Beli Indomie";

Lalu pada terminal/command prompt, masuk ke direktori project lalu jalankan perintah

tsc .\app.ts

File app.js akan otomatis dibuat oleh tsc (typescript compiler), yang isinya kurang lebih seperti berikut.

var todo = "Beli Indomie";

Tentu akan lebih nyaman bila setiap perubahan pada file ts otomatis dikompilasi menjadi file js. Untuk itu dapat digunakan option -w.

tsc -w .\app.ts
Sharing is caring:

Leave a Comment