اشکال زدایی با Blockly و Blockly-Samples

گاهی اوقات هنگام توسعه یک افزونه در نمونه های بلوکی، باید تغییرات مربوطه را در خود Blockly ایجاد کنید. اکثر افزونه ها برای واکشی Blockly از رجیستری npm تنظیم شده اند، بنابراین شما فقط می توانید از کدهایی استفاده کنید که قبلاً در npm منتشر شده است. این امر اشکال زدایی تغییرات Blockly را دشوار می کند. هنگامی که می خواهید تغییراتی را در نمونه های بلوکی و بلوکی ایجاد و آزمایش کنید، می توانید از هر یک از روش های زیر برای استفاده از تغییرات منتشر نشده خود با هم استفاده کنید.

روش 1: لینک npm

می توانید به npm بگویید به جای واکشی بسته از رجیستری npm از یک بسته از دستگاه شما استفاده کند. با استفاده از این روش، باید به نقشه های منبع دسترسی داشته باشید که اشکال زدایی blockly_compressed را آسان تر می کند. می‌توانید از این روش با تغییراتی در هسته‌ای که هنوز به GitHub منتقل نشده‌اند، استفاده کنید.

1. در فورک بلوکی شما:

   $ npm run package
   $ cd dist
   $ npm link
   

   این مراحل هسته Blockly را می‌سازند، آن را بسته‌بندی می‌کنند، سپس یک پیوند نمادین به فایل‌های بسته‌شده ایجاد می‌کنند.

2. در فورک نمونه های بلوکی:

   $ npm link blockly
   

   این مرحله به npm می‌گوید به جای واکشی بسته از npm، به دنبال پیوند نمادینی که قبلاً ایجاد کرده‌اید بگردد.

3. npm run start تا افزونه خود را آزمایش کنید.

هنگامی که تغییراتی در هسته ایجاد می کنید، باید آن را بازسازی و بسته بندی مجدد کنید.

روش 2: واکشی از GitHub

می‌توانید به npm بگویید به جای اینکه از رجیستری npm یک بسته را از GitHub دریافت کند. با استفاده از این روش، باید به نقشه های منبع دسترسی داشته باشید که اشکال زدایی blockly_compressed را آسان تر می کند. شما باید از نسخه ای از blockly استفاده کنید که قبلاً در جایی در GitHub منتشر شده است.

1. مطمئن شوید که بخش scripts در package.json برای افزونه شما شامل موارد زیر است:

   "postinstall": "blockly-scripts postinstall"
   

   این اسکریپت پس از نصب از GitHub در مرحله بعد به طور خودکار Blockly ساخته می شود.

2. به جای ارائه شماره نسخه برای blockly در package.json ، یک آدرس git و نام شعبه ارائه دهید:

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

   اگر تغییرات ادغام نشده ای داشته باشید، این می تواند پیوندی به فورک بلاکی شما نیز باشد.

3. npm install

4. npm run start تا افزونه خود را آزمایش کنید

وقتی تغییراتی را در core Blockly ایجاد می‌کنید، باید آنها را به GitHub در شعبه مشخص شده فشار دهید. علاوه بر این، زمانی که می‌خواهید npm نسخه جدیدی را از GitHub دریافت کند، باید npm uninstall blockly (یا در غیر این صورت آن را از node_modules خود حذف کنید) و سپس آن را مجدداً همانطور که در بالا توضیح داده شد، نصب کنید.

روش 3: زمین بازی پیشرفته

می توانید از زمین بازی پیشرفته (در هسته Blockly) برای اشکال زدایی افزونه خود استفاده کنید. با استفاده از این روش، از blockly_uncompressed استفاده می‌کنید که ممکن است اشکال‌زدایی با آن آسان‌تر باشد زیرا به نقشه‌های منبع تکیه نمی‌کنید. اگر در اشکال زدایی با منبع نقشه ها مشکل دارید یا می خواهید افزونه خود را با استفاده از ویژگی های زمین بازی پیشرفته آزمایش کنید، از این روش استفاده کنید.

1. در فهرست پلاگین خود در blockly-samples:

   $ npm run build
   $ cd dist
   $ pwd
   

   این افزونه شما را می سازد و بسته بندی می کند. سپس مسیر فهرست کامل دایرکتوری dist را برای افزونه شما چاپ می کند. این مسیر را کپی کنید؛ در مرحله بعدی به آن نیاز خواهیم داشت.

2. در blockly، در advanced_playground.html :

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

   سپس باید هر گونه تنظیمات مورد نیاز برای افزونه خود را نیز انجام دهید. برای مثال، ممکن است لازم باشد مقادیر خاصی را در شی گزینه مشخص کنید. این تنظیمات را در تنظیمات فضای کاری موجود انجام دهید.

3. زمین بازی پیشرفته را در مرورگر باز کنید تا افزونه خود را آزمایش کنید.

وقتی تغییراتی را در بلوک ایجاد می‌کنید، فقط باید به‌روزرسانی کنید. وقتی تغییراتی را در افزونه خود ایجاد می کنید، باید npm run build دوباره اجرا کنید.