حاولت اليوم مساعدة صديق في استخدام وحدة JS التي وجدها على Github. صديقي عالم ممتاز ، لكنه ليس متخصصًا في JS. منذ أن كنت أقوم بالبحث والتدريس في معهد ماساتشوستس للتكنولوجيا خلال السنوات الست الماضية ، أصبحت بشرتي فاترة من مدى الارتباك في كل شيء. مجموعة من الاستثناءات غير الضرورية والأخطاء الغامضة ونقص التغذية الراجعة المناسبة. ويبدو لي أنني لم أساعده كثيراً على النجاة من خيبة الأمل التي مر بها خلال ساعة العذاب هذه أو حتى ، حتى استسلم.كان شيء من هذا القبيل ...ملاحظة: تم تغيير أسماء الحزمة والأشخاص لحماية هويتهم. لقد حذفت أيضًا العديد من المشكلات التي كانت محددة جدًا لهذه الحزمة. يتم استرداد بعض الأخطاء من الذاكرة ، لذا أعلمني إذا أسأت فهم شيء ما.جون : مرحبًا ، أريد تجربة هذه الخوارزمية التي وجدتها في Github. يقول ما يجب استخدامه import functionName packageName، ثم اتصل به functionName(). كل شيء يبدو بسيطا جدا! لا أحتاج حقًا إلى واجهة المستخدم ، لذا سأستخدم العقدة!أنا (ليا): بالطبع ، تبدو العقدة كإطار جيد!يبدأ John npm install packageName --saveوفقًا لتوصية README. ثم node index.js.العقدة:تحذير: لتحميل وحدة ES ، قم بتعيين "type": "module" في package.json أو استخدم الملحق .mjs.
خطأ في بناء الجملة: لا يمكن استخدام عبارة استيراد خارج الوحدة النمطية
جون: ولكن ليس لدي أي حزمة. json ...Leah: قم بتشغيلها npm init، وسوف تولدها!يبدأ John npm init، ويتنقل عبر معالج التثبيت ، ويضيفه يدويًا type: "module"إلى package.json الذي تم إنشاؤه.أطلق جون node index.js.العقدة:خطأ في بناء الجملة: لا يمكن استخدام عبارة استيراد خارج الوحدة النمطية
ومن الغريب ، أن الوحدة الداخلية للمشروع أخطأت هذه المرة. ماذا؟!ليا: حسنًا ، الجحيم ، فقط قم بتشغيله في متصفح ، هذه هي وحدة ES6 ، هناك فقط خوارزمية JS نظيفة لا تستخدم Node API ، يجب أن تعمل.يقوم جون بإنشاء صفحة index.html بسيطة بخط <script type="module" src="index.js">وتحميلها في مستعرض.لا شيء في وحدة التحكم. الداه تا.Lea: حسنًا ، نعم ، تحتاج إلى تكوين مسار الوحدة النمطية لاستيراد packageName. تقوم العقدة بأشياء خاصة لحلها node_modules، لذلك في المتصفح تحتاج إلى تحديد المسار الصريح بنفسك.ينظر جون إلى ملفاته ، ولكن لا يوجد دليل node_modules هناك.ليا: حسنًا ، نعم ، لقد بدأته npm installقبل ظهورك package.json، ربما هذه هي النقطة! حاول مجددا!جون يبدأ جون مرة أخرى npm install packageName --save: أوه ، الآن ظهر دليل node_modules!يبحث جون بشكل يائس عن نقطة دخول في node_modules. ثم يقوم بتحرير index.js وفقًا لذلك وإعادة تحميله.ثعلب النار:نوع MIME غير صحيح: text / html
Lea: بالطبع ، يفتح لك file://! صديقي ، كيف تعيش في وقتنا بدون مضيف محلي؟ حاليًا ، استخدام Javascript لـ file://محدود للغاية.جون: ولكن لماذا أنا ... حسنًا ، سأدير مضيفًا محليًا.يدير جون localhost ، ويفتح index.html على localhost : 80.ثعلب النار:نوع MIME غير صحيح: text / html
جون (تنهدات) . هل تحتاج إلى تكوين مضيف محلي لإصدار ملفات JS بنوع نص / جافا سكريبت؟ليا: ماذا؟ لا! لأنه يعلم أن. حسنًا ... انظر إلى علامة التبويب "الشبكات". أظن أنه لا يمكنه العثور على الوحدة النمطية الخاصة بك ، لذلك قام بإرجاع صفحة HTML 404 ، ثم يشكو من أن هذه الصفحة ليست كذلك text/javascript.ينظر إلى node_modules مرة أخرى ، يصحح المسار. اتضح أن VS Code يطي الدلائل بدليل فرعي واحد فقط ، لذلك لم نلاحظ ذلك.في الواقع ، أعتقد أن هذا يعد تحسينًا جيدًا في سهولة الاستخدام نيابة عن VS Code ، فهو يحسن الكفاءة ، ولكن كان يجب أن يجعلوا الأشياء أكثر وضوحًا.ثعلب النار:خطأ في بناء الجملة: مفقود) بعد المعلمات الرسمية
ليا: ماذا؟ هذا من حزمة المصدر ، ليس خطأك. لا أفهم ... هل يمكنني النظر إلى هذا الخط؟ينقر جون على الخط الذي يسبب خطأليا: يا إلهي. هذه ليست جافا سكريبت ، هذه نسخة مطبوعة !!! مع الامتداد. js !!!جون: نعم ، أردت فقط تشغيل سطر واحد من الكود لاختبار هذه الخوارزمية ...جون يستسلم. ويخلص إلى أنه من الأفضل عدم لمس وحدات العقدة أو npm أو ES6 مطلقًا.النهاية.يرجى ملاحظة أن John هو عالم كمبيوتر يعرف الكثير عن الويب: لقد تم تثبيت Node & npm ، وكان يعرف أنواع MIME ، ويمكنه بدء المضيف المحلي عند الحاجة. ما الذي يأمله المبتدئون؟