antfu
تطبيق أفضل ممارسات تطوير الويب لـ Anthony Fu
المشاريع غالباً ما تنقصها أدوات وتكوينات متسقة بين أعضاء الفريق. تقدم هذه المهارة أفضل ممارسات محددة الأفكار من Anthony Fu بما في ذلك تكوين TypeScript و ESLint و Vitest وإعدادات CI/CD التي تضمن جودة كود متسقة وتجربة مطور متسقة عبر أي مشروع ويب.
下載技能 ZIP
在 Claude 中上傳
前往 設定 → 功能 → 技能 → 上傳技能
開啟並開始使用
測試它
正在使用「antfu」。 كيف يجب أن أقوم بتكوين TypeScript لمشروع جديد؟
預期結果:
- لمشروع TypeScript يتبع أفضل ممارسات Anthony Fu:
- ```json:tsconfig.json
- {
- "compilerOptions": {
- "target": "ESNext",
- "module": "ESNext",
- "moduleResolution": "Bundler",
- "strict": true,
- "jsx": "preserve",
- "resolveJsonModule": true,
- "isolatedModules": true,
- "esModuleInterop": true,
- "lib": ["ESNext", "DOM"],
- "skipLibCheck": true,
- "noEmit": true
- },
- "include": ["**/*.ts", "**/*.d.ts", "**/*.tsx"],
- "exclude": ["node_modules"]
- }
- ```
正在使用「antfu」。 ما تكوين ESLint الذي يجب أن أستخدمه؟
預期結果:
- استخدم @antfu/eslint-config كتكوين أساسي:
- ```bash
- # تثبيت المكتبات
- pnpm add -D eslint @antfu/eslint-config
- ```
- ```js:eslint.config.js
- import antfu from '@antfu/eslint-config'
- export default antfu({
- stylistic: true,
- vue: false,
- jsonc: false,
- })
- ```
安全審計
安全Pure documentation skill containing development best practices. Static findings are false positives from markdown code examples. No executable code, scripts, or runtime behavior. All detected patterns are standard documentation formatting showing example configurations.
品質評分
你能建構什麼
إعداد مشروع ويب جديد بأدوات متسقة
تطبيق تكوينات معيارية لـ TypeScript و ESLint والاختبار عند بدء مشروع جديد لضمان الاتساق من البداية.
تدريب أعضاء الفريق على ممارسات الكود الحالية
الرجوع لهذه المهارة لتوضيح ممارسات المشروع لأسلوب الكود والاختبار و CI/CD للمطورين الجدد.
ترحيل مشروع موجود إلى أدوات حديثة
مراجعة تكوينات المشروع الحالية وتحديد المجالات التي يمكن تحسينها من خلال تبني أدوات وممارسات حديثة.
試試這些提示
أريد إعداد مشروع TypeScript جديد باستخدام أفضل ممارسات Anthony Fu. كيف يبدو ملف tsconfig.json الخاص بي؟ يجب أن تتضمن الإعدادات لوضع صارم وهدف ESNext وأي تكوينات TypeScript أخرى مقترحة.
ساعدني في تكوين ESLint لمشروعي باستخدام @antfu/eslint-config. ما الحزم التي أحتاج إلى تثبيتها؟ ما الذي يجب أن يحتوي عليه ملف eslint.config.js؟ اظهرني كيفية دمجه مع TypeScript و Vue إذا لزم الأمر.
أقوم بإعداد مشروع متعدد الوحدات باستخدام pnpm. كيف يبدو ملف pnpm-workspace.yaml الخاص بي؟ ما هي الإعدادات المقترحة لإدارة الحزم وكيف أقوم بتكوين @antfu/ni للأوامر المتسقة؟
أريد إعداد CI/CD لمشروعي باستخدام GitHub Actions. ما ملف العملية الذي يجب أن أستخدمه؟ ما هي الإجراءات الموصى بها لتشغيل الفحص التلقائي والاختبار والتحقق من النوع؟ الرجوع إلى نمط sxzz/workflows إذا كان applicable.
最佳實務
- استخدم أوامر @antfu/ni (ni, nr, nx) لإدارة الحزم المتسقة عبر فريقك بغض النظر عن تفضيل مدير الحزم
- قم بتكوين simple-git-hooks مع lint-staged لتشغيل فحص الأداء تلقائياً على الملفات المسودة قبل الالتزام
- قم بإعداد TypeScript بهدف ESNext وتمكين وضع الصرامة من بداية المشروع لالتقاط أخطاء النوع مبكراً
避免
- مزج مختلف مديري الحزم (npm, yarn, pnpm) في نفس المشروع بدون استخدام @antfu/ni
- تعطيل وضع TypeScript الصارم أو قواعد ESLint دون فهم العواقب
- تخطي فحوصات ما قبل الالتزام وفحوصات CI لتوفير الوقت - هذا يؤدي إلى جودة كود غير متسقة