التهيئة المتقدمة لـ React

في هذا الفصل، سنستكشف التهيئات المتقدمة لتحسين تطبيق React الخاص بك. وسنرى كيف يمكن تخصيص بيئة التطوير وبيئة الإنتاج.

تهيئة TypeScript

تضيف TypeScript نظام أنواع ثابتًا إلى JavaScript، مما يحسّن قابلية صيانة الشيفرة ومتانتها.

1. تثبيت TypeScript :

npm install --save typescript @types/node @types/react @types/react-dom @types/jest

2. تهيئة ملف tsconfig.json :

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",
    "baseUrl": "src"
  },
  "include": ["src"]
}

تهيئة Webpack

على الرغم من أن Create React App تستخدم Webpack داخليًا، يمكننا إخراج التهيئة منها (eject) لتخصيص متقدم:

1. إخراج التهيئة (eject) :

npm run eject