تصحيح الأخطاء باستخدام عينات محظورة أو كتلة

في بعض الأحيان، عند تطوير مكوّن إضافي في نماذج كتلة، ستحتاج إلى إجراء تغييرات مقابلة في تطبيقBlockly نفسه. ويتم إعداد معظم المكوّنات الإضافية لجلب Blockly من قاعدة بيانات npm، لذا لن تتمكن سوى من استخدام الرمز الذي تم إصداره من قبل في npm. وهذا من شأنه أن يجعل تصحيح أخطاء BBlockly أمرًا صعبًا. عندما تريد إجراء تغييرات واختبارها في نماذج كل من العينات المحظورة والمحظورة، يمكنك استخدام أي من الطرق التالية لاستخدام التغييرات التي لم يتم إصدارها معًا.

الطريقة 1: رابط npm

يمكنك الطلب من npm استخدام حزمة من جهازك بدلاً من جلب الحزمة من سجلّ npm. باستخدام هذه الطريقة، يجب أن يكون لديك إمكانية الوصول إلى خرائط المصدر التي تجعل تصحيح أخطاء blockly_compress أسهل. يمكنك استخدام هذه الطريقة مع تغييرات أساسية لم يتم دفعها بعد إلى GitHub.

1. في مفترق الطرق:

   $ npm run package
   $ cd dist
   $ npm link
   

   تعمل هذه الخطوات على إنشاء تصميم Openly الأساسي ووضعه في حزمة، ثم إنشاء رابط رمزي للملفات المجمَّعة.

2. في مفترق نماذج العينات الكتلية:

   $ npm link blockly
   

   تخبر هذه الخطوة npm بالبحث عن الرابط الرمزي الذي أنشأته سابقًا بدلاً من جلب الحزمة من npm.

3. npm run start لاختبار المكون الإضافي.

عندما تجري تغييرات في جوهرها، سيكون عليك إعادة إنشائها وإعادة تجميعها.

الطريقة 2: الجلب من GitHub

يمكنك الطلب من npm جلب حزمة من GitHub بدلاً من جلبها من سجلّ npm. باستخدام هذه الطريقة، ستحصل على إمكانية الوصول إلى خرائط المصدر التي تجعل تصحيح أخطاء blockly_compress أسهل. سيتعين عليك استخدام نسخة من الكتلة التي تم نشرها بالفعل في مكان ما على GitHub.

1. تأكّد من أنّ قسم scripts في "package.json" للمكوّن الإضافي يتضمّن ما يلي:

   "postinstall": "blockly-scripts postinstall"
   

   سيتم إنشاء هذا النص البرمجي تلقائيًا بعد تثبيته من GitHub في خطوة لاحقة.

2. بدلاً من توفير رقم إصدار بشكل محدود في package.json، يمكنك إدخال عنوان git واسم الفرع:

   "blockly": "git://github.com/google/blockly.git#develop"
   

   يمكن أن يكون هذا أيضًا رابطًا إلى مفترق الطرق الخاص بك إذا كان لديك تغييرات غير مدمجة.

3. npm install كالمعتاد

4. npm run start لاختبار المكون الإضافي

عند إجراء تغييرات في CoreBlockly، سيتعين عليك دفعها إلى GitHub في الفرع المحدد. بالإضافة إلى ذلك، عندما تريد npm لجلب إصدار جديد من GitHub، عليك npm uninstall blockly (أو إزالته من node_modules) ثم إعادة تثبيته كما هو موضّح أعلاه.

الطريقة 3: أداة "مساحة المرح المتقدّمة"

يمكنك استخدام ساحة المشاركات المتقدمة (في تطبيقBlockly الأساسي) لتصحيح أخطاء المكون الإضافي. من خلال هذه الطريقة، ستستخدم السمة blockly_uncompressed، التي قد يكون من الأسهل تصحيح الأخطاء فيها لأنّك لن تعتمد على خرائط المصدر. استخدم هذه الطريقة إذا كنت تواجه مشكلة في تصحيح الأخطاء باستخدام خرائط المصدر أو كنت تريد اختبار المكون الإضافي باستخدام ميزات الملعب المتقدم.

1. في دليل المكوّنات الإضافية في نماذج الحظر:

   $ npm run build
   $ cd dist
   $ pwd
   

   يؤدي هذا إلى إنشاء المكون الإضافي وحزمه. ثم يطبع مسار الدليل الكامل لدليل dist للمكوّن الإضافي. انسخ هذا المسار، سنحتاج إليه في الخطوة التالية.

2. بشكل حظر، في advanced_playground.html:

   <script src="$PATH_TO_DIST_DIR/index.js">
   

   ثم تحتاج أيضًا إلى إجراء أي إعداد مطلوب للمكون الإضافي. على سبيل المثال، قد تحتاج إلى تحديد قيم معيّنة في كائن الخيارات. يمكنك إجراء هذا الإعداد في إعداد Workspace الحالي.

3. افتح الصفحة المتقدمة في المتصفح لاختبار المكوّن الإضافي.

عند إجراء تغييرات في حظر، ما عليك سوى إعادة التحميل. عندما تجري تغييرات على المكون الإضافي، يجب إعادة تشغيل npm run build.