kunthawat
a8fa17a947
- pnpm-workspace.yaml from Astro v7 uses allowBuilds (pnpm 10.14+ schema); pnpm 9 in old Dockerfile errored 'packages field missing or empty' - Switch Dockerfile to corepack + pnpm@11, matching pnpm-lock.yaml - Verified pnpm install --frozen-lockfile passes with pnpm 11
มิตซูชัยพร สมุทรสาคร — Astro Website
เว็บโคลนของ www.mitsuthailand.com (บริษัท มิตซูชัยพร จำกัด ศูนย์มิตซูบิชิ สมุทรสาคร) สร้างเป็น Astro static site โดย content ต้นฉบับถูก clon ลงมาครบ (หน้า + ภาพ + script) และ URL ทั้งหมดเป็น relative / dynamic — เปลี่ยนโดเมนได้โดยไม่ต้องแก้ไฟล์
📁 โครงสร้าง
.
├── public/ ← หน้า HTML ต้นฉบับ (copy ตรง → dist/)
│ ├── index.html ← หน้าแรก (เหมือนต้นฉบับเป๊ะ)
│ ├── catalog/item/… ← หน้ารายการสินค้า (10 รุ่น + request-form)
│ ├── catalog/keyword/… ← หน้า keyword
│ ├── catalog/brand/ catalog/category/ catalog/e-catalog/ catalog/search/
│ ├── about-us/ contactus/ footer/ rfq/
│ ├── sites/ core/ themes/ ← CSS/JS (mirror โครงสร้างเดิม)
│ └── assets/external/ ← รูปจาก media.yellowpages.co.th (โหลดมาแล้ว)
├── src/
│ ├── layouts/Base.astro ← layout Astro (ใช้ตอน refactor หน้าเป็น component)
│ └── pages/example.astro ← ตัวอย่างหน้า Astro component (build ได้)
├── astro.config.mjs ← config Astro
├── Dockerfile ← multi-stage: pnpm build → nginx serve
├── nginx.conf ← nginx serve static
├── entrypoint.sh ← inject env (GA/form/map) ลง HTML ก่อน serve
├── .env.example ← ตัวแปร env ที่ตั้งได้
└── gen_astro.py ← (utility) regen หน้าใน public/ จาก static clone
🚀 Deploy (Docker / EasyPanel)
docker build -t mitsu-chaiyaporn .
docker run -d -p 8080:80 mitsu-chaiyaporn
EasyPanel: สร้าง Service แบบ Dockerfile → repo นี้ → port 80 → deploy
เปลี่ยนโดเมนได้เลย — ทุก URL เป็น relative path
🧱 ทำไมหน้า content อยู่ใน public/ (ไม่ใช่ src/pages)
หน้าที่ clone มาเป็น HTML ของ Drupal ดิบ — ถ้าใส่ใน src/pages/ Astro จะพยายาม
parse/transform ผ่าน ultrahtml และพัง (HTML ที่ไม่สมบูรณ์ของ Drupal)
เลยใช้วิธี: วาง HTML ใน public/ → Astro copy ไป dist/ ตรงๆ → output เหมือนต้นฉบับ 100%
อยากแก้หน้าเป็น Astro component (เพื่อ maintain):
- ย้าย HTML หน้าเดิม ออกจาก
public/(เช่นpublic/about-us/) - สร้าง
src/pages/about-us.astroที่ใช้Baselayout + components - build — หน้าใหม่จะมาจาก Astro, หน้าที่เหลือยังเป็น clone ตรงๆ
ดูตัวอย่างที่ src/pages/example.astro + src/layouts/Base.astro
✉️ ฟอร์ม + Environment (.env)
ค่าต่าง ๆ กำหนดผ่าน env (inject ที่ startup โดย entrypoint.sh + envsubst):
| ตัวแปร | ค่า default | ความหมาย |
|---|---|---|
GA_ID |
(ว่าง=ปิด) | Google Analytics / GTM ID |
FORM_EMAIL |
mail@mitsuchaiyaporn.com |
อีเมลรับฟอร์ม RFQ/ติดต่อ (FormSubmit) |
GMAP_LAT / GMAP_LNG |
13.557…/100.289… |
พิกัดแผนที่ (แบบฟรี ไม่ต้อง API key) |
GMAP_EMBED |
(จาก lat/lng) | URL map เต็ม (override ได้) |
EasyPanel: Service → Environment → เพิ่มตัวแปร → Redeploy
cp .env.example .env
docker run --env-file .env -p 8080:80 mitsu-chaiyaporn
⚠️ หลังตั้ง
FORM_EMAILต้องยืนยันอีเมลครั้งแรกที่ formsubmit.co
🔄 Update เว็บจากต้นฉบับ
gen_astro.py(ใช้ static clone ใส่ public/) — แต่หลัก ๆ ให้เอา HTML ล่าสุดจากwww.mitsuthailand.comวางลงpublic/แล้วpnpm build
📞 ข้อมูลติดต่อ
- โทร: 034-836-738 ต่อ 9 / 034-422-230 · Line: @823bhcbq · FB: facebook.com/mitsuchaiyaporn
- ที่อยู่: 923/249 ถนนเอกชัย ต.มหาชัย อ.เมืองสมุทรสาคร 74000
- เปิด: ศูนย์บริการ จ-ส 08:00-17:00 / ฝ่ายขาย ทุกวัน 08:00-17:00