ทักษะ i18n
คำสั่ง AI สำหรับตรวจสอบและครอบข้อความ i18n
ปัญหา
ฐานโค้ดของคุณมีข้อความฮาร์ดโค้ด 500 รายการกระจายอยู่ในคอมโพเนนต์ เทมเพลต และมุมมอง การครอบด้วยตนเองใช้เวลาหลายวันกับงานค้นหาและแทนที่อันน่าเบื่อ แม้ครอบแล้ว คุณยังอาจพลาดประโยคแยกส่วนที่ใช้ไม่ได้ในภาษาเยอรมัน ตรรกะพหูพจน์ที่ล้มเหลวในภาษาอาหรับ และคีย์กำพร้าที่ทำให้ไฟล์ภาษาบวม
วิธีแก้
คำสั่งแบบสแลช AI สองคำสั่งจัดการเวิร์กโฟลว์ i18n ทั้งหมด รัน /i18n-review เพื่อตรวจสอบโค้ดแบบอ่านอย่างเดียว แล้วรัน /i18n-wrap เพื่อแก้ทุกอย่างโดยอัตโนมัติ ทั้งสองคำสั่งตรวจหาเฟรมเวิร์ก เข้าใจรูปแบบไฟล์ภาษา และตรวจสอบการเปลี่ยนแปลงก่อนคอมมิต
/i18n-review
การตรวจสอบแบบอ่านอย่างเดียวที่ค้นหาประโยคแยกส่วน พหูพจน์เสียหาย ข้อความที่ยังไม่ครอบ และคีย์ที่ไม่ใช้ โดยไม่แก้โค้ด
/i18n-wrap
ครอบข้อความฮาร์ดโค้ดด้วยฟังก์ชันแปลที่ถูกต้องโดยอัตโนมัติ สร้างคีย์เชิงความหมาย อัปเดตไฟล์ภาษา และตรวจสอบบิลด์
คำสั่ง /i18n-review
คำสั่ง review ตรวจสอบฐานโค้ดแบบอ่านอย่างเดียว โดยสแกนทุกไฟล์เพื่อหาปัญหา i18n แล้วสร้างรายงานเรียงตามความสำคัญ พร้อมตำแหน่งไฟล์และคำแนะนำแก้ไขที่แน่นอน โดยไม่แก้โค้ดของคุณ
/i18n-review src/
/i18n-review src/ --framework=next-intlสิ่งที่ตรวจสอบ
- ประโยคแยกส่วน : การเรียก t() ที่นำมาต่อกันและทำให้ลำดับคำเสียหายในภาษาอื่น
- ครอบมากเกินไป : ข้อความทางเทคนิค คลาส CSS, URL และค่า enum ที่ถูกครอบด้วย t() อย่างไม่ถูกต้อง
- ครอบไม่ครบ : ข้อความ UI ที่มองเห็น เช่น ป้ายปุ่ม หัวข้อ และข้อความแสดงข้อผิดพลาดยังฮาร์ดโค้ดอยู่
- ปัญหาพหูพจน์ : ใช้ตัวดำเนินการ ternary หรือการตรวจ === 1 แทนไวยากรณ์พหูพจน์ ICU ที่ถูกต้อง
- คีย์ที่ไม่ใช้ : คีย์คำแปลซึ่งกำหนดไว้ในไฟล์ภาษาแต่ไม่เคยอ้างอิงในโค้ด
- ค่ารูปแบบที่ฮาร์ดโค้ด : วันที่ สกุลเงิน และตัวเลขที่ไม่ใช้ตัวจัดรูปแบบ Intl
คำสั่ง /i18n-wrap
คำสั่ง wrap ครอบข้อความฮาร์ดโค้ดโดยอัตโนมัติด้วยฟังก์ชันแปลที่ถูกต้องสำหรับเฟรมเวิร์ก โดยตรวจหาไลบรารี i18n สร้างคีย์เชิงความหมายที่จัดกลุ่มตามคอมโพเนนต์หรือฟีเจอร์ อัปเดตไฟล์ภาษา และตรวจว่าบิลด์ยังผ่าน
/i18n-wrap src/components/
/i18n-wrap src/ --framework=react-i18nextสิ่งที่ทำ
- การตรวจหาเฟรมเวิร์ก : ระบุไลบรารี i18n และฟังก์ชันแปล (t, $t, $_, gettext และอื่นๆ)
- การสร้างคีย์เชิงความหมาย : สร้างคีย์ที่สื่อความหมายอย่าง nav.signIn และ errors.notFound แทนป้ายทั่วไป
- การอัปเดตไฟล์ภาษา : เพิ่มคีย์ใหม่ลงในไฟล์ภาษาต้นฉบับด้วยรูปแบบที่ถูกต้อง (JSON, YAML, PO และอื่นๆ)
- การตรวจสอบบิลด์ : รันคำสั่งบิลด์ ลินต์ และทดสอบหลังครอบ เพื่อจับการถดถอย
เฟรมเวิร์กที่รองรับ
ทั้งสองคำสั่งตรวจหาเฟรมเวิร์กอัตโนมัติจากการพึ่งพาในโปรเจกต์ และคุณระบุอย่างชัดเจนด้วยแฟล็ก --framework ได้ ต่อไปนี้คือเฟรมเวิร์กที่รองรับ 10 รายการ พร้อมฟังก์ชันแปลและรูปแบบพหูพจน์
| เฟรมเวิร์ก | ฟังก์ชันแปล | รูปแบบพหูพจน์ |
|---|---|---|
| react-i18next | t() | key_one / key_other |
| next-intl | t() | ICU {count, plural, ...} |
| vue-i18n | $t() | Pipe syntax | singular | plural |
| angular i18n | $localize | ICU {count, plural, ...} |
| svelte-i18n | $_() | ICU {count, plural, ...} |
| flutter intl | S.of(context) | Intl.plural() |
| django | gettext / _() | ngettext() |
| rails i18n | t() | count key |
| laravel | __() / @lang | trans_choice() |
| swift | NSLocalizedString | .stringsdict |
การติดตั้ง
คัดลอกไฟล์คำสั่งไปยังไดเรกทอรี .claude/commands/ เท่านี้ก็เสร็จ ไม่ต้องใช้การพึ่งพาหรือการกำหนดค่า คำสั่งเป็นไฟล์ Markdown ธรรมดาที่ผู้ช่วยเขียนโค้ด AI ทุกตัวเรียกใช้ได้
mkdir -p .claude/commands
cp commands/i18n-review.md .claude/commands/
cp commands/i18n-wrap.md .claude/commands/ตัวอย่างการใช้งาน
โปรเจกต์ React
ตรวจทานแอป React ที่ใช้ react-i18next แล้วครอบข้อความฮาร์ดโค้ดทั้งหมด คำสั่งจะตรวจพบ react-i18next จาก package.json และใช้ฟังก์ชัน t() กับรูปแบบพหูพจน์ key_one/key_other ที่ถูกต้อง
# Review a React project for i18n issues
/i18n-review src/ --framework=react-i18next
# Wrap all hardcoded strings automatically
/i18n-wrap src/components/ --framework=react-i18next
# Result: t() calls inserted, keys added to en/translation.jsonโปรเจกต์ Django
ตรวจสอบเทมเพลตและมุมมอง Django เพื่อหาปัญหา i18n แล้วครอบข้อความด้วย gettext คำสั่งจะตรวจพบ Django จาก settings.py และใช้ _() สำหรับข้อความทั่วไปกับ ngettext() สำหรับพหูพจน์
# Review Django templates and views
/i18n-review myapp/ --framework=django
# Wrap hardcoded strings with gettext
/i18n-wrap myapp/templates/ --framework=django
# Result: _() calls inserted, .po file updatedคู่มือเฟรมเวิร์กที่เกี่ยวข้อง
ลองใช้ i18n Agent ตอนนี้
ลากและวางไฟล์แปลของคุณที่นี่
JSON, YAML, PO, XML, CSV, Markdown, Properties
หรือคลิกเพื่อเลือกไฟล์
ภาษาเป้าหมาย