আমি webpack
একটি node/express
পরিবেশের সাথে ReactJS
সার্ভার সাইড রেন্ডার অ্যাপ্লিকেশন বিকাশের সাথে কাজ শুরু করছি react-router
। আমি ডেভ এবং প্রোড (রানটাইম) পরিবেশের জন্য প্রতিটি ওয়েবপ্যাক প্যাকেজের ভূমিকা সম্পর্কে খুব বিভ্রান্ত হয়ে যাচ্ছি।
এখানে আমার বোঝার সারসংক্ষেপ:
webpack
: একটি প্যাকেজ, একটি ওয়েব অ্যাপ্লিকেশনের বিভিন্ন টুকরা একসাথে যোগদানের এবং একটি একক .js ফাইলে (সাধারণত bundle.js
) বান্ডিল করার সরঞ্জাম । এরপরে ফলাফল ফাইলটি অ্যাপ্লিকেশন দ্বারা লোড হওয়ার জন্য একটি উন্নত পরিবেশে পরিবেশন করা হয় এবং কোড চালানোর জন্য সমস্ত প্রয়োজনীয় উপাদান রয়েছে। বৈশিষ্ট্যগুলির মধ্যে সঙ্কুচিত কোড, মিনিফাইং ইত্যাদি অন্তর্ভুক্ত রয়েছে Features
webpack-dev-server
: এমন একটি প্যাকেজ যা ওয়েবসাইট ফাইলগুলি প্রক্রিয়া করার জন্য একটি সার্ভার সরবরাহ করে। এটি bundle.js
ক্লায়েন্ট উপাদানগুলি থেকে একটি একক .js ফাইল ( ) তৈরি করে তবে মেমোরিতে এটি পরিবেশন করে। -hot
কোডের পরিবর্তনের ক্ষেত্রে সমস্ত বিল্ডিং ফাইলগুলি নিরীক্ষণ এবং মেমরিতে একটি নতুন বান্ডিল তৈরির বিকল্পও রয়েছে ( )। সার্ভারটি সরাসরি ব্রাউজারে পরিবেশন করা হয় (উদা http:/localhost:8080/webpack-dev-server/whatever
:)। মেমোরি লোডিং, হট প্রসেসিং এবং ব্রাউজার পরিবেশনার সংমিশ্রণটি যখন বিকাশের পরিবেশের জন্য আদর্শ কোড পরিবর্তন হয় তখন ব্যবহারকারী ব্রাউজারে অ্যাপ্লিকেশন আপডেট করতে দেয়।
উপরের পাঠ্য সম্পর্কে আমার যদি সন্দেহ থাকে তবে আমি নীচের সামগ্রীর বিষয়ে সত্যই নিশ্চিত নই, সুতরাং প্রয়োজনে দয়া করে আমাকে পরামর্শ দিন
একটি সাধারণ সমস্যা যখন ব্যবহার webpack-dev-server
সঙ্গে node/express
যে webpack-dev-server
একটি সার্ভার হয়, হিসাবে node/express
। এটি ক্লায়েন্ট এবং কিছু নোড / এক্সপ্রেস কোড (একটি এপিআই ইত্যাদি) উভয়ই চালানোর পক্ষে এই পরিবেশটিকে জটিল করে তোলে। দ্রষ্টব্য: আমি এটিকেই মুখোমুখি করেছি তবে তা আরও বিশদে কেন হয় তা বুঝতে পেরে ভাল লাগবে ...
webpack-dev-middleware
: এটি একই webpack-dev-server
পদক্ষেপ (ইনমেমরি বান্ডিলিং, হট রিলোডিং) সহ মিডলওয়্যার , তবে বিন্যাসে যা server/express
অ্যাপ্লিকেশনটিতে ইনজেকশনের ব্যবস্থা করা যেতে পারে । এইভাবে, আপনার webpack-dev-server
নোড সার্ভারের অভ্যন্তরীণ এক ধরণের সার্ভার রয়েছে the উফফ: এটা কি পাগল স্বপ্ন ??? কীভাবে এই টুকরাটি ডেভ এবং প্রোড সমীকরণকে সমাধান করতে পারে এবং জীবনকে সহজ করে তোলে
webpack-hot-middleware
: এটি ... এখানে আটকে আছে ... এই টুকরোটি সন্ধানের সময় খুঁজে পেয়েছে webpack-dev-middleware
... কীভাবে এটি ব্যবহার করবেন সে সম্পর্কে কোনও ধারণা নেই।
নোট: দুঃখিত যে কোনও ভুল ধারণা আছে। জটিল পরিবেশে এই রূপগুলি আনস্ট্যান্ডেড করার জন্য আমার সত্যই সহায়তা দরকার। যদি কনভেনিয়েন্ট হয় তবে দয়া করে আরও প্যাকেজ / ডেটা যুক্ত করুন যা পুরো পরিস্থিতি তৈরি করবে।
webpack-dev-middleware
(এবং সম্ভাব্যwebpack-hot-middleware
) ব্যবহার করবেন। নির্দিষ্ট বৈশিষ্ট্য না থাকলে আপনি চানwebpack-dev-server
না এটি আপনার কেবলমাত্র এটি ব্যবহার করা উচিত।