يظهر لي الخطأ 'App' is defined but never used no-unused-vars

رسالة الخطأ تعني أن المكون App تم استيراده في ملف index.js ولكن لم يتم استخدامه، وذلك صحيح، حيث أنك قمت بكتابة المكون بحرف صغير كالتالي app وليس App عليك بتعديل الكود وسيتم عرض المكون:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './app';

ReactDOM.render(<App />, document.getElementById('root'));

خطأ no-unused-vars هو خطأ شائع في React يحدث عندما تقوم بإنشاء متغير ولكن لا تستخدمه في أي مكان في الكود الخاص بك. يحاول ESLint منع حدوث هذه الأخطاء عن طريق إخطارك عند إنشاء متغير غير مستخدم.

لذلك هناك خطأ في الكود. يجب أن تكون الحرف الأول من “app” كبيرًا في ملف index.js

يجب أن يكون الكود كالتالي:

import App from './app'; 
ReactDOM.render( <App />, document.getElementById('root'));

وليس 

import App from './app';

ReactDOM.render( <app />, document.getElementById('root'));
 

يجب ملاحظة أن ESLint هي أداة لتحديد الأنماط الموجودة في كود ECMAScript / JavaScript وإعداد التقارير عنها ، بهدف جعل الكود أكثر اتساقًا وتجنب الأخطاء لذلك يمكنك الإستفادة من رسائل الأخطاء التي تنتجها ESLint لتحديد الخطأ