Build, Pemeriksaan Tipe, dan Deploy

Halaman ini menelusuri apa yang terjadi setelah sebuah commit masuk ke repository: perintah mana yang dijalankan, di titik mana build berhenti, dan bagaimana penyaring build Vercel memutuskan apakah build dijalankan. Aturan schema yang menentukan lolos atau tidaknya astro check dibahas di Skema Content Collection tools, sedangkan perakitan halaman dan berkas gaya dibahas di Layout, Sidebar, dan Tema.

Rantai perintah dari commit sampai dist/

Skrip build bukan satu langkah. Nilainya adalah astro check && astro build (package.json:6-12¹). Operator && membuat astro build hanya berjalan bila astro check keluar tanpa error. Karena itu satu error tipe menghentikan seluruh deploy, bukan hanya menghasilkan peringatan.

graph TD
  A["commit masuk ke repository"] --> B["ignore-build.sh: baca VERCEL_GIT_COMMIT_REF"]
  B -- "branch lain" --> C["Build cancelled (exit 0)"]
  B -- "staging atau main" --> D["Build can proceed (exit 1)"]
  D --> E["build: astro check"]
  E -- "ada error tipe" --> F["build berhenti, dist/ tidak dibuat"]
  E -- "lolos" --> G["astro build"]
  G --> H["dist/ sebagai keluaran statis"]
  style A fill:#f59e0b,color:#000
  style B fill:#f59e0b,color:#000
  style C fill:#dc2626,color:#fff
  style D fill:#2d7d46,color:#fff
  style E fill:#8b5cf6,color:#fff
  style F fill:#dc2626,color:#fff
  style G fill:#2d7d46,color:#fff
  style H fill:#336791,color:#fff
%% fig: Alur commit sampai deploy
%% desc: Commit disaring ignore-build.sh, lalu masuk ke rantai astro check dan astro build yang menghasilkan dist/ atau berhenti di pemeriksaan tipe.

Seluruh skrip lain hanya dipakai di mesin lokal. Tabel berikut memuat isinya apa adanya.

Semua paket yang dibutuhkan saat build berada di dependencies, bukan devDependencies (package.json:13-20²). Tidak ada pemisahan itu, jadi pemasangan dependensi produksi di CI tetap membawa typescript dan @astrojs/check.

Pemasangan dependensi memakai Yarn. Field packageManager berisi [email protected] (package.json:5³), dan repository menyimpan yarn.lock di akar.

Pemeriksaan tipe yang menghentikan build

Konfigurasi TypeScript mewarisi preset astro/tsconfigs/strict (tsconfig.json:1-6⁴). Preset itu yang menentukan seberapa ketat astro check menilai kode, ditambah satu pengecualian: forceConsistentCasingInFileNames disetel false, sehingga perbedaan huruf besar-kecil pada path import tidak diperiksa.

Tipe yang diperiksa tidak seluruhnya ada di dalam repository. src/env.d.ts merujuk ../.astro/types.d.ts dan astro/client (src/env.d.ts:1-2⁵), sementara .astro/ dan dist/ tercatat di .gitignore sebagai keluaran build dan generated types (.gitignore:1-7). Konsekuensinya, salinan baru hasil clone belum punya tipe collection sampai tipe itu dibangkitkan, dan astro check tidak bisa dinilai hanya dari isi Git.

⚠️ astro check membaca schema di src/content/config.ts dan menilai setiap berkas di src/content/tools. Satu berkas Markdown dengan field yang tidak cocok membuat astro check gagal, dan karena &&, astro build tidak pernah dijalankan. Periksa template di Format Berkas dan Aturan Kontribusi sebelum membuat commit.

Integrasi Tailwind dan kompilasi Sass

Konfigurasi Astro sangat tipis. Berkas astro.config.mjs hanya mendaftarkan satu integrasi, yaitu tailwind() di dalam integrations (astro.config.mjs:1-8⁶). Tidak ada adapter, site, atau opsi build lain di berkas itu, jadi keluarannya adalah situs statis biasa.

graph LR
  P["astro.config.mjs: integrations tailwind()"] --> Q["src/styles/main.sass: @tailwind base, components, utilities"]
  Q --> R["tailwind.config.mjs: content ./src/**/*"]
  R --> S["CSS akhir pada keluaran build"]
  style P fill:#f59e0b,color:#000
  style R fill:#f59e0b,color:#000
  style Q fill:#8b5cf6,color:#fff
  style S fill:#336791,color:#fff
%% fig: Rantai pemrosesan gaya saat build
%% desc: Integrasi tailwind() memproses direktif @tailwind di main.sass, dan pemindaian content di tailwind.config.mjs menentukan kelas yang ikut dihasilkan.

Tiga direktif @tailwind berada di baris awal src/styles/main.sass (src/styles/main.sass:1-3⁷). Berkas itu memakai sintaks Sass berbasis indentasi, sehingga dependensi sass wajib ada agar build berhasil, dan berkas tersebut diimpor dari Layout.astro (src/layouts/Layout.astro:2⁸). Pemindaian kelas diatur oleh content yang menunjuk ./src/**/* dengan daftar ekstensi panjang, sementara theme dan plugins dibiarkan kosong (tailwind.config.mjs:1-8⁹).

Karena content hanya memindai src, kelas yang hanya muncul di berkas di luar src tidak akan ikut dihasilkan. Gejalanya adalah CSS yang hilang di hasil build, bukan error.

Penyaring build Vercel di ignore-build.sh

Repository memakai skrip Vercel Ignored Build Step. Skrip mencetak nilai VERCEL_GIT_COMMIT_REF, lalu membandingkannya dengan dua nama branch (ignore-build.sh:1-14¹⁰).

⚠️ Exit code di skrip ini terbalik dari kebiasaan shell. Di Ignored Build Step Vercel, exit 1 berarti build dilanjutkan dan exit 0 berarti build dibatalkan (ignore-build.sh:5-13¹¹). Mengubah urutan exit tanpa menyesuaikan maknanya akan membuat commit di main justru tidak pernah di-deploy.

Karena yang diperiksa adalah nama branch pada commit, hanya commit di staging dan main yang membangun situs. Commit di branch fitur, termasuk yang datang dari Pull Request, dihentikan sebelum astro check sempat berjalan. Pemeriksaan tipe baru terjadi di tahap berikutnya, setelah penyaring meloloskan commit.

⚠️ Skrip ini hanya menyaring. Adapter Vercel tidak terdaftar di astro.config.mjs (astro.config.mjs:1-8⁶), dan tidak ada vercel.json di akar repository. Perintah build dan perintah install yang sebenarnya dipakai Vercel berada di pengaturan proyek pada dashboard, di luar repository ini.