ساخت اسکریپت ها

Blockly از بیش از صد فایل TypeScript تشکیل شده است. این فایل‌ها قبل از استفاده باید توسط کامپایلر TypeScript، tsc ، به جاوا اسکریپت کامپایل شوند. این کار تعداد زیادی فایل .js ایجاد می‌کند که برای آزمایش محلی مناسب هستند، اما بارگذاری چنین تعداد زیادی فایل از طریق اینترنت برای کاربران نهایی یک تجربه کند است. برای بارگذاری سریع‌تر Blockly، از کامپایلر Closure برای فشرده‌سازی (کوچک‌سازی) و ترکیب آنها در شش فایل ("بسته" یا "تکه") با حجم کل کمتر از نصف فایل‌های فشرده نشده استفاده می‌شود.

در این فرآیند، کدی که از جدیدترین ویژگی‌های ECMAScript استفاده می‌کند - ویژگی‌هایی که ممکن است با همه مرورگرها سازگار نباشند - به ES6 تبدیل می‌شوند که عموماً با اکثر مرورگرهای پرکاربرد سازگار است. بنابراین، مهم است که فقط کد کوچک‌شده را به کاربران نهایی خود ارائه دهید.

مخزن RaspberryPiFoundation/blockly فقط شامل کد منبع است. قبلاً شامل محصولات ساخت نیز می‌شد، اما از سال ۲۰۱۹ بسته‌های کوچک‌شده به عنوان بسته blockly NPM منتشر شده‌اند و از سال ۲۰۲۲ نیز به عنوان یک فایل .tgz به هر نسخه GitHub پیوست شده‌اند، بنابراین نیازی به ساخت Blockly نیست، مگر اینکه بخواهید خود Blockly را هک کنید - به ویژه در فایل‌های موجود در دایرکتوری‌های core ، blocks ، generators یا msg .

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

حالت فشرده و غیر فشرده

بارگذاری Blockly مستقیماً از فایل‌های .js جداگانه تولید شده توسط کامپایلر TypeScript به عنوان "حالت غیرفشرده" شناخته می‌شود. از آنجا که از چندین مرحله ساخت کند جلوگیری می‌کند، این امر چرخه ویرایش-کامپایل-اجرا را سریع می‌کند. همچنین اشکال‌زدایی را تسهیل می‌کند زیرا کد جاوا اسکریپتی که اجرا می‌شود تقریباً به اندازه منابع اصلی TypeScript خوانا است و نیاز به وابستگی به نقشه‌های منبع را برطرف می‌کند.

بارگذاری Blockly از بسته‌های کوچک‌شده، به عنوان "حالت فشرده" شناخته می‌شود. این بهترین روش برای آزمایش تغییرات Blockly هنگام استفاده از آن به عنوان وابستگی یک بسته دیگر است، زیرا (نسخه منتشر نشده‌ای از) بسته npm blockly را آزمایش می‌کند.

نکته: در مخزن blockly جاهایی وجود دارد که اصطلاحات "حالت کامپایل نشده" و "حالت کامپایل شده" به ترتیب به عنوان مترادف "حالت فشرده نشده" و "حالت فشرده شده" استفاده می‌شوند. این استفاده در گذشته منطقی بود زیرا Closure Compiler برای فشرده‌سازی (کوچک‌سازی) کد استفاده می‌شد، اما اکنون کامپایلر TypeScript همیشه مورد نیاز است، حتی در حالت فشرده نشده، بنابراین این اصطلاحات جایگزین بالقوه گیج‌کننده و نامطلوب هستند.

شروع سریع

  • اگر تغییرات محلی ایجاد کرده‌اید و می‌خواهید مطمئن شوید که آنها باعث اختلال در ساخت یا هیچ آزمایشی نشده‌اند، دستور زیر را اجرا کنید:

    npm test
    

    برای ساخت Blockly و اجرای مجموعه تست آن.

  • اگر می‌خواهید تغییرات محلی را در مرورگر آزمایش کنید، دستور زیر را اجرا کنید:

    npm start
    

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

    هر فایلی که در core/ ، blocks/ و generators/ تغییر یابد، به طور خودکار دوباره کامپایل می‌شود؛ برای مشاهده تغییرات، تب مرورگر را مجدداً بارگذاری کنید.

  • برای ساخت نسخه اصلاح‌شده محلی Blockly و آزمایش آن، در حالت فشرده، به عنوان یک وابستگی از یک بسته npm دیگر، دستور زیر را اجرا کنید:

    npm run package
    

    برای ساخت بسته Blockly، سپس

    cd dist && npm link
    

    برای اینکه به npm بگویید فایل‌های کامپایل شده را کجا پیدا کند و سپس قبل از اجرا به دایرکتوری پروژه شما cd .

    npm link blockly
    

    برای اینکه بسته شما به جای بسته منتشر شده blockly ، از نسخه تازه کامپایل شده Blockly استفاده کند.

مرجع دقیق اسکریپت

این بخش scripts اصلی موجود در فایل package.json مربوط به Blockly را به همراه توضیحی در مورد عملکرد آنها فهرست می‌کند.

این اسکریپت‌ها فایل‌ها را در دو مکان تولید می‌کنند:

  • فایل‌های موجود در زیرشاخه build/ فایل‌های واسطه‌ای هستند که برای آزمایش محلی استفاده می‌شوند یا توسط بخش‌های بعدی خط لوله ساخت جذب می‌شوند.
  • فایل‌های موجود در زیرشاخه dist/ محتویات بسته npm منتشر شده را تشکیل می‌دهند.

هیچ‌کدام از این دایرکتوری‌ها در مخزن blockly git ردیابی نمی‌شوند.

clean

npm run clean با حذف دایرکتوری‌های build/ و dist/ ، هرگونه build قبلی را پاک می‌کند. این دستور برای رفع خطاهای ساخت و ساز پیچیده، به ویژه مواردی که ناشی از تغییر نام فایل منبع هستند، مفید است.

messages

npm run messages فایل‌های پیام‌ها در msg/json/ را با هر تغییری که در msg/messages.js ایجاد شده است، به‌روزرسانی می‌کند و باید پس از هر بار تغییر آن فایل اجرا شود.

langfiles

npm run langfiles فایل‌های زبان کامپایل شده در build/msg/ را از فایل‌های پیام‌ها در msg/json تولید می‌کند.

tsc

npm run tsc کامپایلر TypeScript را روی محتویات دایرکتوری‌های core/ ، blocks/ و generators/ اجرا می‌کند و فایل‌های .js را به صورت جداگانه در build/src/ خروجی می‌دهد.

minify

npm run minify closure-make-deps و closure-calculate-chunks اجرا می‌کند تا نحوه تقسیم فایل‌های .js کامپایل شده به تکه‌هایی (بسته‌های کوچک‌شده) را تعیین کند، و پس از آن closure-compiler را برای ایجاد تکه‌ها به صورت زیر اجرا می‌کند:

  • محتوای build/src/core/ به dist/blockly_compressed.js تبدیل می‌شود.
  • محتوای build/src/blocks/ به dist/blocs_compressed.js تبدیل می‌شود.
  • محتوای build/src/generators/javascript/ (به‌علاوه build/src/generators/javascript.js ) به dist/javascript_compressed.js تبدیل می‌شود.
  • و به همین ترتیب برای dart ، lua ، php و python .

چاک‌های تولید شده از یک پوشش برای اطمینان از سازگاری با تعریف ماژول جهانی استفاده می‌کنند، بنابراین قبل از قرار گرفتن در بسته‌بندی، نیازی به پردازش اضافی نیست.

build

npm run build وظایف minify و langfiles را اجرا می‌کند. این دستور باید هر کاری که برای بارگذاری Blockly playground در حالت فشرده یا غیر فشرده لازم است را انجام دهد.

package

npm run package وظایف clean و build را اجرا می‌کند و سپس:

  • یک بسته‌بندی UMD روی فایل‌های موجود در build/msg/ اعمال می‌کند و نسخه‌های بسته‌بندی‌شده را در dist/msg/ قرار می‌دهد.
  • فایل‌های پشتیبانی اضافی مختلفی را به dist/ اضافه می‌کند، و در صورت لزوم، از پوشش‌های UMD نیز بهره می‌برد.

publish

npm run publish توسط تیم Blockly برای انتشار پکیج blockly npm استفاده می‌شود. این دستور به زیرساخت داخلی گوگل وابسته است، بنابراین برای توسعه‌دهندگان خارجی مفید نیست.

lint

دستور npm run lint ESLint را اجرا می‌کند و تحلیل استاتیکی از کد منبع Blockly انجام می‌دهد تا مشکلات را پیدا کند.

test

npm test (یا npm run test ) وظیفه package را اجرا می‌کند و سپس تست‌های خودکار مختلفی (از جمله اجرای ESLint) را اجرا می‌کند. این باید اجرا شود و روی هر کدی که به عنوان درخواست pull در مخزن blockly ارسال می‌شود، اعمال شود.