📋 محتويات الصفحة
🎯 يستخدم في
مجالات استخدام هذه الأداة
توليد TypeScript Types من GraphQL Schema
إنشاء React Query/Apollo Hooks
توليد Type-safe API Clients
تقليل كتابة الأنواع يدوياً
بناء Type-safe GraphQL APIs
Auto-complete في IDE
✨ المميزات
أبرز مميزات هذه الأداة
Types كاملة من schema
React Query Hooks تلقائية
Apollo Client Hooks
Support Schema Stitching
Plugin-driven (قابل للتوسيع)
Watch mode لتوليد مستمر
دعم Scalars مخصصة
TypeScript
Flow
ReasonML
CI/CD friendly
200+ plugins
⚠️ العيوب
نقاط يجب مراعاتها
يتطلب تكوين أولي
قد يكون معقداً للمشاريع الصغيرة
بطيء مع Schema كبيرة
يعتمد على schema محدث
💻 مثال على الاستخدام
كيفية استخدام هذه الأداة
npm install -D @graphql-codegen/cli @graphql-codegen/typescript @graphql-codegen/typescript-operations @graphql-codegen/typescript-react-query
# graphql-codegen.yml
schema: "http://localhost:4000/graphql"
documents: "src/**/*.graphql"
generates:
src/generated/graphql.ts:
plugins:
- typescript
- typescript-operations
- typescript-react-query
# script في package.json:
# "codegen": "graphql-codegen --config graphql-codegen.yml"📚 أدوات أخرى في Code-Generation
قد يعجبك أيضاً
Angular CLI
⭐أداة سطر الأوامر الرسمية لـ Angular
bolt.new
⭐مولد تطبيقات ويب كاملة بـ AI داخل المتصفح
bolt.new
⭐مطور ويب AI كامل في المتصفح (In-Browser Full-Stack AI Developer)
Create Next App
⭐أداة إنشاء مشاريع Next.js الرسمية
Create React App
⭐أداة إنشاء مشاريع React الرسمية
Create Vue
⭐الأداة الرسمية لإنشاء مشاريع Vue.js