קורן בן עזרא
Anthony Fu (antfu)מה זה antfu's skills?
antfu/skills הוא אוסף של 11 סקילים שמרכז את ההעדפות והניסיון של Anthony Fu, יחד עם ידע מהתיעוד הרשמי של הכלים שהוא עובד איתם. אם האתר או האפליקציה שלכם בנויים ב-Vue, Nuxt או Vite, הסקילים האלה עוזרים ל-Claude לכתוב קוד שתואם את הגרסאות העדכניות ואת הנוהגים המקובלים בעולם הזה.
Anthony Fu הוא מפתח קוד פתוח שעובד בעיקר בעולם של Vue ו-Vite, ולפי הפרופיל שלו ב-GitHub הוא חלק מהצוות של Nuxt, עובד ב-Vercel ויש לו יותר מ-40 אלף עוקבים. האוסף שלו מתחלק לשני סוגים. שני סקילים הוא כותב ומתחזק בעצמו: antfu, עם ההעדפות שלו לארגון קוד, ESLint, pnpm, Vitest, מונו-ריפו ופרסום ספריות, ו-antfu-design, עם עקרונות עיצוב שמבוססים על UnoCSS וטוקנים סמנטיים לבהיר ולכהה.
תשעה הסקילים האחרים נוצרו מהתיעוד הרשמי של כל כלי ועברו כוונון ידני: vue, nuxt, nitro, pinia, vite, vitepress, vitest, unocss ו-pnpm. היתרון הוא שהמאגר מחובר לתיעוד המקורי דרך git submodules, כך שאפשר לרענן את הסקילים כשהכלים מתעדכנים. לדוגמה, הסקיל vite כבר מכסה מעבר ל-Vite 8 ו-Rolldown, ו-pnpm מכסה catalogs ו-overrides. זה חשוב, כי מודל שפה נוטה לכתוב לפי גרסאות ישנות שהוא ראה באימון.
חשוב לדעת שני דברים לפני שמתקינים. ראשית, היוצר מגדיר את הפרויקט כהוכחת היתכנות וכותב במפורש שעוד לא בדק לעומק כמה טוב הסקילים עובדים בפועל. שנית, האוסף רלוונטי רק למי שעובד עם הכלים האלה. בעל עסק עם אתר וורדפרס או חנות שופיפיי לא ירוויח ממנו כלום, אבל סוכנות שבונה אתרים ב-Nuxt או מפתח שמתחזק אפליקציית Vue יקבלו קוד מדויק יותר ופחות תיקונים.
למי זה מתאים
- סוכנויות ופרילנסרים שבונים אתרים ואפליקציות ב-Nuxt או ב-Vue
- מפתחים שמתחזקים פרויקט Vite ורוצים שהסוכן יכיר את הגרסאות העדכניות
- צוותים שכותבים בדיקות ב-Vitest ומנהלים מונו-ריפו עם pnpm
- מי שבונה אתר תיעוד או בלוג טכני ב-VitePress
מה הוא עושה
ידע מהתיעוד הרשמי
תשעה סקילים נוצרו מהתיעוד של Vue, Nuxt, Nitro, Pinia, Vite, VitePress, Vitest, UnoCSS ו-pnpm, ולכן Claude מקבל הפניות לתיעוד אמיתי במקום זיכרון ישן מהאימון.
מתעדכן עם המקור
המאגר מושך את התיעוד דרך git submodules, כך שכשכלי משתנה, אפשר לסנכרן את המקור ולייצר את הסקיל מחדש.
ההעדפות של Anthony Fu
הסקיל antfu מגדיר כללי קוד ברורים: קובץ לכל אחריות, טיפוסים בקובץ types.ts נפרד, imports מפורשים בלי auto-imports בפרויקטים חדשים, ובדיקות Vitest ליד כל קובץ.
עיצוב עם UnoCSS
antfu-design מביא טוקנים סמנטיים לבהיר ולכהה, עקרונות נגד עיצוב גנרי וליטוש של מיקרו-אינטראקציות לדפי נחיתה ולממשקי כלים.
טעינה לפי צורך
כל סקיל נטען רק כשהמשימה נוגעת בכלי שלו, כך שאפשר להתקין את כל האוסף בלי להעמיס על ההקשר של Claude בכל שיחה.
תבנית לאוסף משלכם
אפשר לעשות fork למאגר, לעדכן את meta.ts עם הכלים שלכם ולבקש מהסוכן לייצר סקילים חדשים מהתיעוד, לפי ההוראות ב-AGENTS.md.
מה יש בפנים
antfuההעדפות של Anthony Fu לפרויקטי JavaScript ו-TypeScript: הקמת פרויקט, ESLint, מונו-ריפו ופרסום ספריות.antfu-designעקרונות עיצוב מבוססי UnoCSS עם טוקנים סמנטיים לבהיר ולכהה, לממשקי כלים ולדפי נחיתה.vueVue 3: Composition API, מאקרו של script setup, מערכת הריאקטיביות ורכיבים מובנים.nuxtNuxt: SSR, ניתוב לפי קבצים, server routes, useFetch, middleware ורינדור היברידי.nitroNitro, ערכת השרת שמפעילה את Nuxt: נתיבי שרת, cache, אחסון, משימות ופריסה ל-Node, Bun, Deno, Cloudflare ו-Vercel.piniaניהול state רשמי ל-Vue: stores, getters ו-actions.viteהגדרות Vite, API לפלאגינים, SSR ומעבר ל-Vite 8 עם Rolldown.vitepressבניית אתרי תיעוד סטטיים עם Vite ו-Vue, ערכות נושא ו-Markdown עם רכיבי Vue.vitestכתיבת בדיקות, mocking, כיסוי קוד, סינון בדיקות ו-fixtures.unocssמנוע CSS אטומי שמכיל את Tailwind: כללים, shortcuts ו-presets כמו Wind, Icons ו-Attributify.pnpmמנהל חבילות: workspaces, catalogs, patches, overrides ו-global virtual store.דוגמאות שימוש
מה כותבים ל-Claude אחרי ההתקנה, ומה מקבלים.
הקמת אתר Nuxt ללקוח
תקים לי פרויקט Nuxt חדש לאתר של משרד עורכי דין: עמוד בית, עמוד תחומי עיסוק וטופס יצירת קשר עם server route ששולח מייל. תעבוד לפי ההעדפות של antfu.מה מקבלים: פרויקט Nuxt מסודר עם imports מפורשים, server route לטופס ומבנה קבצים לפי הכללים של הסקיל.
שדרוג ל-Vite 8
הפרויקט שלי על Vite 6. תבדוק מה צריך לשנות כדי לעבור ל-Vite 8 עם Rolldown ותכין רשימת שינויים לפני שאתה נוגע בקוד.מה מקבלים: רשימת שינויים שמבוססת על הסקיל vite, ואחרי אישור עדכון של vite.config.ts והפלאגינים.
בדיקות לחנות Vue
תכתוב בדיקות Vitest לקומפוננטת עגלת הקניות שלי ב-Vue, כולל mock לקריאת ה-API של המחירים.מה מקבלים: קובצי בדיקה לצד הקומפוננטה, עם describe ו-it ו-mock לשכבת ה-API.
אתר תיעוד למוצר
תבנה אתר תיעוד ב-VitePress למערכת ההזמנות שלנו, עם תפריט צד, חיפוש ודף התחלה מהירה.מה מקבלים: פרויקט VitePress עם מבנה תיקיות, הגדרות ערכת נושא ועמודי Markdown ראשונים.
מה צריך לפני שמתחילים
- Claude Code או סוכן אחר שתומך בסקילים
- Git לצורך ההתקנה הידנית. בהתקנה הרשמית צריך pnpm (הפקודה pnpx)
- רלוונטי רק לפרויקטים ב-Vue, Nuxt, Vite ובכלים הקשורים
- אין מפתחות ואין עלויות. רישיון MIT
- לפי היוצר זה פרויקט הוכחת היתכנות שלא נבדק לעומק בשימוש אמיתי
אין עדיין Claude Code? במדריך הזה יש התקנה צעד אחרי צעד.
איך מתקינים את antfu's skills.
יש 2 דרכים, ומספיקה אחת מהן. הראשונה הכי פשוטה.
הדרך הקלה: מדביקים בצ'אט של Claude Code
פותחים שיחה חדשה ב-Claude Code, מעתיקים את ההודעה ומדביקים. כש-Claude מבקש אישור להריץ, לוחצים Allow.
תתקין לי את 11 הסקילים של Anthony Fu מ-GitHub. תריץ את הפקודה הבאה ותגיד לי כשהיא מסתיימת: D="$(mktemp -d)" && git clone --depth 1 -q https://github.com/antfu/skills "$D/repo" && mkdir -p ~/.claude/skills && find "$D/repo/skills" -maxdepth 2 -name SKILL.md -exec dirname {} \; | while read d; do cp -R "$d" ~/.claude/skills/; done && rm -rf "$D" && echo "הותקן ✓"
בטרמינל, ידנית
למי שמעדיף להריץ בעצמו. מעתיקים לטרמינל ומריצים.
D="$(mktemp -d)"
git clone --depth 1 -q https://github.com/antfu/skills "$D/repo"
mkdir -p ~/.claude/skills
find "$D/repo/skills" -maxdepth 2 -name SKILL.md -exec dirname {} \; | while read d; do cp -R "$d" ~/.claude/skills/; done
rm -rf "$D"אין הגדרות, רק פותחים סשן חדש של Claude Code. כדאי לבדוק קודם שאין לכם סקילים אחרים עם שמות זהים, כמו vue או vite, כי ההעתקה תכתוב מעליהם.
- בטרמינל מריצים ls ~/.claude/skills ומוודאים שיש תיקיות כמו antfu, nuxt, vite ו-vitest
- מקלידים / בסשן חדש ובודקים ש-antfu ו-nuxt מופיעים
- שואלים את Claude "אילו סקילים יש לך לעבודה עם Vue ו-Nuxt?"
מריצים שוב את פקודת ההתקנה, והיא תעתיק את הגרסאות החדשות מעל הישנות. מי שהתקין בדרך הרשמית מריץ שוב pnpx skills add antfu/skills --skill='*' -g.
rm -rf ~/.claude/skills/{antfu,antfu-design,nitro,nuxt,pinia,pnpm,unocss,vite,vitepress,vitest,vue}איך משתמשים ביום יום
- עובדים כרגיל בפרויקט, וכשהמשימה נוגעת ב-Nuxt, Vite או Vitest, Claude טוען את הסקיל המתאים לבד.
- כדי לקבל את סגנון הקוד של Anthony Fu מבקשים במפורש "תעבוד לפי ההעדפות של antfu" או כותבים /antfu.
- אפשר לבחור רק חלק מהסקילים: בהתקנה הידנית מעתיקים רק את התיקיות שצריך מתוך skills/.
- דרך ההתקנה הרשמית לפי ה-README: pnpx skills add antfu/skills --skill='*', ועם -g להתקנה גלובלית.
טיפים שימושיים
- אם אתם עובדים עם Tailwind ולא עם UnoCSS, התקינו בלי antfu-design ו-unocss כדי שהסוכן לא יערבב בין השניים.
- ההעדפות של antfu דעתניות, למשל ביטול auto-imports בפרויקטים חדשים. בפרויקט קיים של צוות אחר עדיף לבקש ממנו לשמור על הסגנון הקיים.
- רוצים שסקיל מסוים יחול תמיד? ה-README מציע להפנות אליו מתוך AGENTS.md או CLAUDE.md של הפרויקט.
- שלבו עם Superpowers לתכנון ולבדיקות, ועם הסקילים האלה לידע הספציפי על הכלים.
תקלות נפוצות
Claude לא משתמש בסקיל למרות שהוא מותקן
סקיל ישן שלי בשם vue נמחק
pnpx: command not found
שאלות ותשובות
זה מתאים לאתר וורדפרס או לחנות שופיפיי?
הסקילים בדוקים?
מה ההבדל בין הסקילים הידניים לאלה שנוצרו מתיעוד?
למה ב-README כתובים 10 סקילים ובמאגר יש 11?
כמה פופולרי המאגר?
קרדיט ומקור. antfu's skills נכתב על ידי Anthony Fu (antfu) ונמצא ב-antfu/skills ברישיון MIT. את העמוד כתב קורן בן עזרא אחרי בדיקה של המאגר ושל פקודות ההתקנה (29.09.2026). מאגרים מתעדכנים, ולכן אם משהו השתנה, המאגר הוא המקור הקובע.
obra
yamadashy
Anthropic