ব্লকলি এবং ব্লকলি-নমুনাগুলির সাথে ডিবাগিং

কখনও কখনও ব্লকলি-নমুনাগুলিতে একটি প্লাগইন তৈরি করার সময়, আপনাকে ব্লকলিতেই সংশ্লিষ্ট পরিবর্তন করতে হবে। বেশিরভাগ প্লাগইন এনপিএম রেজিস্ট্রি থেকে ব্লকলি আনার জন্য সেট আপ করা হয়েছে, তাই আপনি কেবলমাত্র সেই কোড ব্যবহার করতে সক্ষম হবেন যা ইতিমধ্যে এনপিএম-এ প্রকাশিত হয়েছে। এটি আপনার ব্লকলি পরিবর্তনগুলি ডিবাগ করা কঠিন করে তুলবে। আপনি যখন ব্লকলি এবং ব্লকলি- উভয় নমুনায় পরিবর্তনগুলি করতে এবং পরীক্ষা করতে চান, তখন আপনি আপনার অপ্রকাশিত পরিবর্তনগুলি একসাথে ব্যবহার করতে নীচের যে কোনও পদ্ধতি ব্যবহার করতে পারেন।

আপনি npm রেজিস্ট্রি থেকে প্যাকেজ আনার পরিবর্তে আপনার মেশিন থেকে একটি প্যাকেজ ব্যবহার করতে npm কে বলতে পারেন। এই পদ্ধতিটি ব্যবহার করে, আপনার সোর্সম্যাপগুলিতে অ্যাক্সেস থাকা উচিত যা ব্লকলি_কম্প্রেসড ডিবাগিংকে সহজ করে তোলে। আপনি এই পদ্ধতিটি মূল পরিবর্তনের সাথে ব্যবহার করতে পারেন যা এখনও গিটহাবে পুশ করা হয়নি।

  1. ব্লকলি আপনার কাঁটাচামচ মধ্যে:

    $ npm run package
    $ cd dist
    $ npm link
    

    এই পদক্ষেপগুলি ব্লকলি কোর তৈরি করে, এটি প্যাকেজ করে, তারপর প্যাকেজ করা ফাইলগুলির একটি সিমলিঙ্ক তৈরি করে।

  2. আপনার ব্লকলি-নমুনার কাঁটা-তে:

    $ npm link blockly
    

    এই ধাপটি npm কে npm থেকে প্যাকেজটি আনার পরিবর্তে আপনার আগে তৈরি করা সিমলিংকটি সন্ধান করতে বলে।

  3. npm run start .

আপনি যখন মূল পরিবর্তন করবেন, তখন আপনাকে এটিকে পুনর্নির্মাণ এবং পুনরায় প্যাকেজ করতে হবে।

পদ্ধতি 2: GitHub থেকে আনুন

আপনি npm রেজিস্ট্রি থেকে পরিবর্তে GitHub থেকে একটি প্যাকেজ আনতে npm কে বলতে পারেন। এই পদ্ধতিটি ব্যবহার করে, আপনার সোর্সম্যাপগুলিতে অ্যাক্সেস থাকা উচিত যা ব্লকলি_কম্প্রেসড ডিবাগিংকে সহজ করে তোলে। আপনাকে ব্লকলির একটি সংস্করণ ব্যবহার করতে হবে যা ইতিমধ্যে গিটহাবে কোথাও প্রকাশিত হয়েছে।

  1. আপনার প্লাগইনের জন্য package.json এর scripts বিভাগে নিম্নলিখিতগুলি রয়েছে তা নিশ্চিত করুন:

    "postinstall": "blockly-scripts postinstall"
    

    এই স্ক্রিপ্টটি পরবর্তী ধাপে গিটহাব থেকে ইনস্টল করার পরে স্বয়ংক্রিয়ভাবে ব্লকলি তৈরি করবে।

  2. package.json এ ব্লকলির জন্য একটি সংস্করণ নম্বর প্রদান করার পরিবর্তে, একটি গিট ঠিকানা এবং শাখার নাম প্রদান করুন:

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

    আপনার যদি আনমার্জ করা পরিবর্তনগুলি থাকে তবে এটি ব্লকলি আপনার নিজের কাঁটাচামচের একটি লিঙ্কও হতে পারে।

  3. npm install

  4. npm run start

আপনি যখন মূল ব্লকলিতে পরিবর্তন করবেন, তখন আপনাকে সেগুলিকে নির্দিষ্ট শাখায় গিটহাবে ঠেলে দিতে হবে। উপরন্তু, আপনি যখন npm-কে GitHub থেকে একটি নতুন সংস্করণ আনতে চান, তখন আপনাকে npm uninstall blockly হবে (অথবা অন্যথায় আপনার node_modules থেকে এটি সরিয়ে ফেলতে হবে) এবং তারপরে উপরে বর্ণিত হিসাবে এটি পুনরায় ইনস্টল করতে হবে।

পদ্ধতি 3: উন্নত খেলার মাঠ

আপনি আপনার প্লাগইন ডিবাগ করতে উন্নত খেলার মাঠ (কোর ব্লকলি) ব্যবহার করতে পারেন। এই পদ্ধতিটি ব্যবহার করে, আপনি blockly_uncompressed ব্যবহার করবেন, যার সাথে ডিবাগ করা সহজ হতে পারে কারণ আপনি সোর্সম্যাপের উপর নির্ভর করবেন না। আপনি যদি সোর্সম্যাপগুলির সাথে ডিবাগ করতে সমস্যায় পড়েন বা আপনি উন্নত খেলার মাঠের বৈশিষ্ট্যগুলি ব্যবহার করে আপনার প্লাগইন পরীক্ষা করতে চান তবে এই পদ্ধতিটি ব্যবহার করুন৷

  1. ব্লকলি-নমুনাগুলিতে আপনার প্লাগইন ডিরেক্টরিতে:

    $ npm run build
    $ cd dist
    $ pwd
    

    এটি আপনার প্লাগইন তৈরি এবং প্যাকেজ করে। তারপর এটি আপনার প্লাগইনের জন্য ডিস্ট ডিরেক্টরির সম্পূর্ণ ডিরেক্টরি পাথ প্রিন্ট করে। এই পথ অনুলিপি; আমরা পরবর্তী ধাপে এটি প্রয়োজন হবে.

  2. ব্লকলি, advanced_playground.html এ :

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

    তারপর আপনাকে আপনার প্লাগইনের জন্য প্রয়োজনীয় যেকোন সেটআপ করতে হবে। উদাহরণস্বরূপ, আপনাকে বিকল্প অবজেক্টে কিছু মান নির্দিষ্ট করতে হতে পারে। বিদ্যমান ওয়ার্কস্পেস সেটআপে এই সেটআপটি করুন।

  3. আপনার প্লাগইন পরীক্ষা করতে ব্রাউজারে উন্নত খেলার মাঠ খুলুন।

আপনি যখন ব্লকলি পরিবর্তন করেন, তখন আপনাকে শুধুমাত্র রিফ্রেশ করতে হবে। আপনি যখন আপনার প্লাগইনে পরিবর্তন করবেন, তখন আপনাকে npm run build পুনরায় চালাতে হবে।