Tới nội dung chính

Phát triển cục bộ

Hướng dẫn này đi qua vòng lặp phát triển hằng ngày của một public app.

1. Khởi động app

Từ root workspace, khởi động dev server của ứng dụng public:

cd apps/home
pnpm exec nuxt dev

Server lắng nghe tại http://localhost:4200 — port được pin trong devServer của nuxt.config.ts ứng dụng. Nx target serve chạy cùng một lệnh đó: npx nx serve @ecoma-io/home.

2. Kiểm tra một trang

Mở một tài liệu trên trình duyệt, ví dụ:

http://localhost:4200/vi/docs/getting-started/installation

Quan sát trang đã render: header với global navigation và bộ chuyển ngôn ngữ, sidebar của docs, breadcrumbs, mục lục, và liên kết trước/tiếp. Dùng View Source của trình duyệt để xác nhận trang được server-render.

3. Thay đổi nội dung

Nội dung Markdown nằm dưới apps/home/content. Sửa một trang tiếng Việt và mở bản tiếng Anh tương ứng để thấy cả hai:

# chọn một trang, ví dụ
$EDITOR apps/home/content/vi/docs/getting-started/local-development.md

nuxt dev nhận thay đổi; trang reload với nội dung mới.

4. Chạy test

Từ root workspace, chạy unit test:

pnpm exec nx test home

Lệnh này chạy các suite Vitest đặt cạnh ứng dụng home — gồm test path-validation và content-resolution.

5. Build

Ứng dụng public là một Cloudflare Worker có SSR; build production cũng prerender mọi trang content:

npx nx build @ecoma-io/home

Output nằm trong apps/home/.output — entry Worker trong server/ cùng HTML đã prerender và asset trong public/. Một Nx target tiêu thụ output này:

  • npx nx deploy @ecoma-io/home --configuration=staging publish nó lên Cloudflare như Worker staging (build tự chạy trước); dùng --configuration=production cho Worker production — lệnh deploy không kèm configuration sẽ từ chối chạy.

Cần xem lại các trang đã prerender mà không deploy, hãy trỏ bất kỳ static file server nào vào thư mục output, ví dụ:

npx serve apps/home/.output/public

Trước: Hướng dẫn · Tiếp: Xây dựng một trang công khai