لا يمكن الوصول للموقع الإلكتروني عند تشغيل المشروع من خلال Live server

لا يوجد محرر أكواد مجاني أفضل من VScode، وتستطيع تحديثه إلى أخر إصدار من خلال الضغط على Help بالأعلى ثم check for updates.

وبالنسبة لمشكلة الـ Live server لاحظ أنه عندما يتم الضغط على أيقونة Go live بالأسفل يظهر لك البورت وهو 5500 بينما لديك أنت في المتصفح البورت هو 8080 لاحظ شريط العنوان في المتصفح، فهل يتم فتح الصفحة بشكل تلقائي لك أم أنك تكتب ذلك في المتصفح؟

وإذا استمرت المشكلة حاول حذف إضافة Live Server ثم أعد تثبيتها ثم أغلق محرر VScode وأعد تشغيل المشروع من خلال السيرفر.

تأكد من تصفح المسار باستخدام المنفذ الصحيح 5500 وليس باستخدام المنفذ 8080، أي عن طريق المسار:

http://localhost:5500

وليس:

http://localhost:8080

عل كل حال، ان كنت تنوي تغيير المنفذ الافتراضي لـ live server في vs code اتبع الخطوات التالية:

1. قم بفتح ملف الإعدادات (Settings) في VS Code، ويمكن الوصول إليه بالنقر على الزر (Ctrl + ,) أو من خلال قائمة File > Preferences > Settings.
2. بعد ذلك، ابحث عن خيار liveServer.settings.port في صندوق البحث في الجزء العلوي من الصفحة.
3. انقر على الزر Edit in settings.json، وسيقوم ذلك بفتح ملف JSON.
4. ثم قم بإضافة السطر التالي داخل العلامات التالية {}:
5. "liveServer.settings.port": 8080\
6. احفظ الملف وتصفح المشروع من خلال المنفذ الذي اعددته.

يمكنك حل المشكلة كما في التعليقات السابقة وبعد التعديل يمكنك إضافة بعض التعديلات لجعل ال live-server يفتح المتقح تلقائياً . يمكنك اتباع الخطوات التالية:

• انتقل إلى ملف "settings.json" في VS Code (باستخدام Ctrl + Shift + P واكتب "Open Settings (JSON)")، وأضف الخيار التالي:

"liveServer.settings.CustomBrowser": "chrome",
"liveServer.settings.NoBrowser": false,
"liveServer.settings.UseBrowserPreview": true,

2. بعد حفظ التغييرات، يجب أن تُفتح الصفحة تلقائيًا في المتصفح الذي حددته (في هذه الحالة، Chrome).

تحتوي هذه الطريقة على خيار "UseBrowserPreview" الذي يفتح الرابط في المتصفح المفضل لديك. بدلاً من استخدام خيار "OpenBrowser" الذي يفتح الرابط في المتصفح الافتراضي لنظام التشغيل. كما يمكنك تغيير قيمة "chrome" إلى اسم المتصفح الذي تفضله إذا كانت لديك متصفح آخر مثبت.