ESLint يمسك الغلط المعروف

قواعد، مش ذوق

ESLint يقرأ الملفات ويمرّر عليها قواعد. القاعدة تقول: تحذير، أو خطأ يوقف الأمر. مثال: متغير متعرّف ومتستخدمش، أو == بدل ===، أو console لو الفريق مش عايزها في الكود النهائي.

الامتداد في المحرر يعلّم السطر. الحزمة eslint في المشروع هي اللي فيها القواعد. من غير الحزمة، الامتداد ما عندوش قواعد مشروعك يطبّقها.

npm install --save-dev eslintnpm init @eslint/config@latest

الأمر التاني معالج إعداد. هيسألك: المشروع CommonJS (require) ولا ES modules (import)، JavaScript ولا TypeScript، وفي أسئلة عن الإطار لو موجود. في مقالات قديمة الأمر اسمه npx eslint --init. من ESLint ٩ المعالج الرسمي هو npm init @eslint/config. راجع صفحة ESLint لو الاسم اتغير تاني.

الناتج ملف إعداد flat config، غالبًا eslint.config.js. ملف .eslintrc القديم و.eslintignore مش شغل النسخة ٩.

ملف القواعد

المصفوفة تتقرا بالترتيب. اللي بعد يغلب اللي قبل لو الاتنين لمسوا نفس القاعدة. js.configs.recommended جابة قواعد جاهزة معقولة، زي متغيرات مش مستخدمة. فوقها بتضيف قواعد الفريق.

import js from "@eslint/js";export default [  { ignores: ["dist/**", "coverage/**"] },  js.configs.recommended,  {    files: ["**/*.js"],    languageOptions: {      ecmaVersion: 2022,      sourceType: "module",    },    rules: {      eqeqeq: ["error", "always"],      "no-unused-vars": "warn",      "no-console": "off",    },  },];

files يحدد الملفات. sourceType: "module" لو الكود import. لو المشروع require، خلّيها "commonjs". eqeqeq على error يعني == يفشل الفحص. no-unused-vars على warn يعلّم من غير ما يوقف الأمر. no-console على off يطفي القاعدة حتى لو جاية من حتة تانية.

node_modules متجاهل في الـ flat config. مخرجات البناء تتحط في أول كائن، بمفتاح ignores، زي المثال اللي فوق. ملف .eslintignore كان شغل الإعداد القديم.

الفحص والإصلاح

npx eslint app.jsnpx eslint app.js --fixnpx eslint .

من غير --fix يطبع الأخطاء والتحذيرات ومكانها. مع --fix يصلح اللي القاعدة معلّمة إنه يتصلح لوحده، زي فاصلة منقوطة ناقصة لو قاعدة semi شغالة.

eqeqeq مش هتتحوّل لوحدها من == لـ ===. الفرق مش شكلي: == بيعمل تحويل نوع، وnull == undefined صحيح بينما === لأ. إصلاح أوتوماتيك هنا ممكن يغيّر سلوك البرنامج، فالأداة تبلّغ وتسيبك.

العلم كلمة واحدة: --fix. مسافة بعد الشرطتين بتخلي الطرفية تشوف حجة اسمها fix، مش علم الإصلاح.

لو الإعدادات اتلخبطت، امسح eslint.config.js وشغّل المعالج من الأول. متبنيش فوق ملف أنت مش فاهم ترتيب مصفوفته.

خلّصت الفصل لما

• تثبّت eslint وتشغّل معالج الإعداد
• تقرأ ملف flat config كمصفوفة بالترتيب
• تفرق error عن warn عن off
• تعرف --fix مش هيحوّل == إلى ===
• تتجاهل dist من مفتاح ignores