انتقل إلى المقال
Aniq-UI

Web Design Agencyحل المشكلات

حل المشكلات

الأخطاء التي قد تواجهها أثناء تثبيت الموقع أو نشره، وسبب كل منها، وطريقة إصلاحه.

Docker لا يعمل

ما تراه
failed to connect to the docker API at unix:///…/docker.sock; check if the path is correct and if the daemon is running

تعرض إصدارات Docker الأقدم الرسالة "Cannot connect to the Docker daemon" بدلًا من ذلك. وفي الحالتين، محرك Docker غير مُشغَّل.

  1. افتح Docker Desktop

    شغّل Docker Desktop وانتظر حتى يُظهر أن المحرك يعمل. على Linux، شغّل الخدمة: sudo systemctl start docker.

  2. تحقق من أن Docker يستجيب

    الطرفية
    docker info

    النتيجة المتوقعة: يطبع قسم Server بدلًا من رسالة خطأ.

  3. شغّل الأمر مرة أخرى

    docker build -t agency-portfolio .، ثم docker run -p 3030:3030 agency-portfolio.

المنفذ مستخدم بالفعل

ما تراه
Bind for 0.0.0.0:3030 failed: port is already allocated
ports are not available: exposing port TCP 0.0.0.0:3030 … bind: address already in use
Error: listen EADDRINUSE: address already in use :::3030

يأتي السطران الأولان من docker run، والأخير من yarn dev أو yarn start. هناك برنامج آخر يستمع بالفعل على المنفذ 3030: غالبًا تشغيل سابق للموقع، أو خادم تطوير لمشروع آخر.

  1. اعرف ما الذي يشغل المنفذ

    على macOS أو Linux:

    الطرفية
    lsof -i :3030

    على Windows، في PowerShell:

    الطرفية
    netstat -ano | findstr :3030

    تظهر الحاوية السابقة في docker ps.

  2. أوقفه

    أغلق ذلك البرنامج، أو أوقف التشغيل السابق: Ctrl+C في طرفيته، أو docker stop مع معرّف الحاوية. ثم شغّل الموقع من جديد.

  3. أو شغّل الموقع على منفذ آخر

    مع Docker، غيّر الرقم على يسار -p. يبقى الرقم على اليمين 3030: إنه المنفذ داخل الحاوية.

    الطرفيةفي landing-page-template-1
    docker run -p 3041:3030 agency-portfolio

    من دون Docker، مرّر المنفذ إلى السكربت:

    الطرفيةفي landing-page-template-1
    yarn dev -p 3041

    ولبناء الإنتاج: yarn start -p 3041.

    النتيجة المتوقعة: يستجيب الموقع على localhost:3041محلي.

فشل بناء Docker

ينزّل البناء الأول صورة Node.js الأساسية وكل الاعتماديات، ثم يبني الموقع. ويتوقف بالرسالة "failed to solve" مع الخطوة التي فشلت عندما يعترضه شيء.

  • لا اتصال أو انتهت المهلة: يحتاج البناء إلى الإنترنت. شغّل الأمر مرة أخرى بعد عودة الاتصال؛ الخطوات المكتملة محفوظة في ذاكرة التخزين المؤقت.
  • لا توجد مساحة كافية على الجهاز (No space left on device): حرّر مساحة في Docker Desktop، أو تحقق مما يستخدمه Docker بالأمر docker system df.
  • يفشل عند الخطوة نفسها في كل مرة: ابنِ مرة أخرى دون ذاكرة التخزين المؤقت.
الطرفيةفي landing-page-template-1
docker build --no-cache -t agency-portfolio .

المجلد يبدو مختلفًا

ما تراه
failed to read dockerfile: open Dockerfile: no such file or directory

نُفّذ الأمر خارج مجلد القالب. يحتوي ملف ZIP على مجلد واحد، landing-page-template-1، وفي أعلاه Dockerfile. بعض المتصفحات تفك ضغط الملف المحمّل تلقائيًا، وحينها يكون المجلد في مجلد التنزيلات بالفعل.

الطرفية
cd landing-page-template-1
ls

يعرض ls (أو dir على Windows) Dockerfile وpackage.json وmessages وpublic وsrc. شغّل الأوامر من هناك.

يقول Yarn إن إصداره 1.22

ما تراه
This project's package.json defines "packageManager": "yarn@4…". However the current global version of Yarn is 1.22…

يثبّت المشروع Yarn 4 عبر Corepack. تعني هذه الرسالة أن Corepack غير مفعّل بعد، فأجاب Yarn العام القديم بدلًا منه.

الطرفية
corepack enable

ثم شغّل yarn install مرة أخرى. إذا لم يكن مع Node.js لديك Corepack، فثبّته أولًا بالأمر npm install -g corepack.

الإعداد الذي غيّرته لا يُحدث أي أثر

يُكتب NEXT_PUBLIC_SITE_URL وNEXT_PUBLIC_API_BASE_URL داخل الموقع عند بنائه. ويحتفظ البناء الذي يعمل بالقيم التي بُني بها.

  • من دون Docker: ضعهما في .env.local داخل مجلد المشروع، لا في .env.example. أعد تشغيل yarn dev، أو شغّل yarn build مرة أخرى قبل yarn start.
  • مع Docker: مرّرهما بـ --build-arg إلى docker build وابنِ من جديد. لا يغيّرهما docker run -e.
  • على Vercel أو استضافة أخرى: غيّر المتغير، ثم انشر مرة أخرى.

الروابط المشتركة والمعاينات تشير إلى localhost

يعرض الرابط الأساسي أو روابط اللغات أو بطاقة المعاينة على الشبكات الاجتماعية العنوان http://localhost:3030. بُني الموقع دون NEXT_PUBLIC_SITE_URL، فاستخدم هذا العنوان الاحتياطي. اضبطه على عنوانك العام، مثل https://www.your-domain.com، وابنِ من جديد.

نموذج التواصل

  • يقول إن الرسالة أُرسلت لكن لا يصل شيء: NEXT_PUBLIC_API_BASE_URL فارغ، فيعرض النموذج رسالة النجاح فقط ولا يرسل شيئًا. اضبطه على عنوان واجهة API الخاصة بك وابنِ من جديد.
  • يعرض "حدث خطأ ما. يرجى المحاولة مرة أخرى.": فشل الطلب إلى المسار /contact في واجهة API الخاصة بك. تُظهر أدوات المطوّر في المتصفح السبب ضمن Network: واجهة API لا يمكن الوصول إليها، أو المسار غير موجود، أو أجابت بخطأ، أو لا تقبل الطلبات من عنوان موقعك (CORS).

الموقع يفتح بالعربية

العنوان الذي لا يحمل لغة، مثل /، يتبع لغة المتصفح، فيحصل المتصفح المضبوط على العربية على /ar. وخلال جلسة المتصفح نفسها يعود أيضًا إلى آخر لغة فُتحت، المحفوظة في ملف تعريف الارتباط NEXT_LOCALE. افتح /en للإنجليزية، أو استخدم مبدّل اللغة في شريط التنقل.

مؤشر الفأرة يختفي

هذا مؤشر الصفحة الخاص: على الشاشات التي يبلغ عرضها 768 بكسل أو أكثر، يخفي مؤشر النظام ويرسم نقطة وحلقة بدلًا منه. للإبقاء على المؤشر العادي، راجع المؤشر المخصص.

يحذّر yarn lint من أن next lint مُهمَل

يأتي التحذير من Next.js 15.5 نفسه. لا يزال yarn lint يشغّل ESLint على الشيفرة ويعرض نتائجه كالمعتاد.

توقفت عند خطوة؟

ابحث عن الحل قبل أن تبدأ من جديد.

حل المشكلات

تفضيلات ملفات تعريف الارتباط

نستخدم ملفات تعريف الارتباط لتعزيز تجربة التصفح الخاصة بك وتحليل حركة المرور على الموقع وتخصيص المحتوى. بالنقر على "قبول الكل"، فإنك توافق على استخدامنا لملفات تعريف الارتباط للتحليلات والإعلانات المخصصة.