নোড.জেএস ব্যবহার করতে বনাম ইএস 6 আমদানি / রফতানি প্রয়োজন


930

একটি প্রকল্পে আমি সহযোগিতা করছি, আমরা দুটি মডিউল সিস্টেম ব্যবহার করতে পারি তার উপর দুটি পছন্দ আছে:

  1. ব্যবহার করে মডিউল আমদানি requireকরা module.exportsএবং ব্যবহার করে এবং রফতানি করা exports.foo
  2. ES6 ব্যবহার করে মডিউল আমদানি করা importএবং ES6 ব্যবহার করে রফতানি করা হচ্ছেexport

একে অপরকে ব্যবহার করে কি পারফরম্যান্স সুবিধা রয়েছে? নোডের ওপরে ES6 মডিউলগুলি ব্যবহার করা হচ্ছে কিনা সে সম্পর্কে আমাদের আর কিছু জানা উচিত?


9
node --experimental-modules index.mjsআপনাকে importব্যাবেল ছাড়াই ব্যবহার করতে দেয় এবং নোড 8.5.0+ এ কাজ করে। আপনি পুরানো উপায়ে পিছনে সামঞ্জস্য সহ আপনার এনপিএম প্যাকেজগুলি স্থানীয় ইএসমডুল হিসাবে প্রকাশ করতে পারেন (এবং হওয়া উচিত) require
ড্যান ড্যাসক্লেস্কু

উত্তর:


728

একে অপরকে ব্যবহার করে কি পারফরম্যান্স সুবিধা রয়েছে?

মনে রাখবেন যে এখনও কোনও জাভাস্ক্রিপ্ট ইঞ্জিন নেই যা স্থানীয়ভাবে ES6 মডিউলগুলিকে সমর্থন করে। আপনি নিজেই বলেছিলেন যে আপনি বাবেল ব্যবহার করছেন। বাবেল রূপান্তরিত করে importএবং যেকোনোভাবে ডিফল্টরূপে exportকমনজেএস ( require/ module.exports) এ ঘোষণা করে । সুতরাং আপনি ES6 মডিউল বাক্য গঠন ব্যবহার করলেও আপনি নোডে কোডটি চালনা করলে আপনি হুডের নীচে কমনজেএস ব্যবহার করবেন।

কমনজেএস এবং ইএস 6 মডিউলগুলির মধ্যে প্রযুক্তিগত পার্থক্য রয়েছে, উদাহরণস্বরূপ কমনজেএস আপনাকে গতিশীলভাবে মডিউলগুলি লোড করতে দেয়। ES6 এটি অনুমতি দেয় না, তবে এর জন্য বিকাশের একটি API রয়েছে

যেহেতু ES6 মডিউলগুলি স্ট্যান্ডার্ডের অংশ, তাই আমি সেগুলি ব্যবহার করব।


16
আমি ব্যবহার করার চেষ্টা ES6 importসঙ্গে requireকিন্তু তারা ভিন্নভাবে কাজ করেন। কমনজেএস নিজেই ক্লাসটি রফতানি করে যখন সেখানে কেবল একটি শ্রেণি রয়েছে। ES6 রফতানীর মতো একাধিক ক্লাস রয়েছে তাই আপনাকে .ClassNameরফতানি ক্লাসটি ব্যবহার করতে হবে। অন্য কোনও পার্থক্য রয়েছে যা বাস্তবে বাস্তবায়নে প্রভাব ফেলে
থেলিমিস্ট

78
@ এন্টেই: মনে হচ্ছে আপনি কোনও নামমাত্র রফতানি নয়, একটি ডিফল্ট রফতানি চান। module.exports = ...;সমতূল্য export default ...exports.foo = ...সমান export var foo = ...;
ফেলিক্স ক্লিং

10
এটি লক্ষণীয় যে যদিও বাবেল শেষ পর্যন্ত importনোডের কমনজেএসে স্থানান্তরিত করে, ওয়েবপ্যাক 2 / রোলআপ (এবং অন্য কোনও বান্ডলার যা ES6 গাছ কাঁপানোর অনুমতি দেয়) এর সাথে ব্যবহার করা হয়, ততক্ষণ কোনও ফাইলের সাথে সমাপ্তি হওয়া সম্ভব যেটি নোড ক্র্যাঙ্কগুলির তুলনায় উল্লেখযোগ্যভাবে ছোট ES6 আমদানি / রফতানির স্থিতিশীল বিশ্লেষণের অনুমতি দেয় বলেইrequire ঠিক ব্যবহারের মাধ্যমে । যদিও এটি নোডের (এখনও) কোনও পার্থক্য তৈরি করবে না, এটি অবশ্যই করতে পারে যদি কোডটি শেষ পর্যন্ত কোনও একক ব্রাউজারের বান্ডিল হিসাবে ঘুরে বেড়ায়।
লি বেনসন

5
আপনার গতিশীল আমদানি করার প্রয়োজন না হলে
চুলিয়ান

3
ES6 মডিউলগুলি সর্বশেষতম ভি 8-তে রয়েছে এবং পতাকাগুলির পিছনে অন্যান্য ব্রাউজারগুলিতেও আসছে। : দেখুন medium.com/dev-channel/...
Nexii ম্যালথাস

180

আপনি বিবেচনা করতে পারেন বিভিন্ন ব্যবহার / ক্ষমতা আছে:

প্রয়োজন:

  • আপনার গতিশীল লোডিং থাকতে পারে যেখানে লোড হওয়া মডিউলটির নাম পূর্বনির্ধারিত / স্থির নয়, বা আপনি শর্তাধীন কোনও মডিউল কেবল তখনই "লোড করা প্রয়োজন" (নির্দিষ্ট কোড প্রবাহের উপর নির্ভর করে) লোড করতে পারেন।
  • লোড করা সমকালীন। এর অর্থ যদি আপনার একাধিক requireগুলি থাকে তবে সেগুলি লোড করা হয় এবং একে একে প্রক্রিয়া করা হয়।

ES6 আমদানি:

  • আপনার প্রয়োজনীয় টুকরোগুলি নির্বাচন করে লোড করতে আপনি নামযুক্ত আমদানি ব্যবহার করতে পারেন। যা স্মৃতি বাঁচাতে পারে।
  • আমদানি অ্যাসিনক্রোনাস হতে পারে (এবং বর্তমান ES6 মডিউল লোডারটিতে এটি বাস্তবে রয়েছে) এবং কিছুটা আরও ভাল সঞ্চালন করতে পারে।

এছাড়াও, প্রয়োজনীয় মডিউল সিস্টেমটি স্ট্যান্ডার্ড ভিত্তিক নয়। ইএস mod মডিউল বিদ্যমান থাকার কারণে এটি এখন স্ট্যান্ডার্ড হওয়ার সম্ভাবনা খুব বেশি। ভবিষ্যতে বিভিন্ন বাস্তবায়নে ES6 মডিউলগুলির জন্য দেশীয় সমর্থন থাকবে যা কার্য সম্পাদনের দিক থেকে সুবিধাজনক হবে।


16
আপনি কী ভাবেন যে ES6 আমদানিগুলি অবিচ্ছিন্ন?
ফেলিক্স ক্লিং

5
@ ফেলিক্সকলিং - বিভিন্ন পর্যবেক্ষণের সংমিশ্রণ। জেএসপিএম (ইএস Mod মডিউল লোডার ...) ব্যবহার করে আমি লক্ষ্য করেছি যে যখন কোনও আমদানি বিশ্বব্যাপী নাম স্থান পরিবর্তন করে তখন অন্যান্য আমদানির অভ্যন্তরে প্রভাবটি পরিলক্ষিত হয় না (কারণ এগুলি অবিচ্ছিন্নভাবে ঘটে ... এটি ট্রান্সপ্লেরড কোডেও দেখা যায়)। এছাড়াও, যেহেতু এটি আচরণ (1 টি আমদানি অন্যকে প্রভাবিত করে না) এটি না করার কোনও কারণ নেই, সুতরাং এটি বাস্তবায়ন নির্ভর হতে পারে
অমিত

35
আপনি খুব গুরুত্বপূর্ণ কিছু উল্লেখ করেছেন: মডিউল লোডার। যদিও ES6 আমদানি ও রফতানি বাক্য গঠন সরবরাহ করে, এটি মডিউলগুলি কীভাবে লোড করা উচিত তা নির্ধারণ করে না। গুরুত্বপূর্ণ অংশটি হ'ল ঘোষণাগুলি স্থিতিশীলভাবে বিশ্লেষণযোগ্য, যাতে কোডটি কার্যকর না করে নির্ভরতা নির্ধারণ করা যায়। এটি মডিউল লোডারকে মডিউলটিকে সুসংগতভাবে বা অযৌক্তিকভাবে লোড করতে দেয়। তবে ইএস mod মডিউলগুলি নিজেরাই সিঙ্ক্রোনাস বা অ্যাসিঙ্ক্রোনাস নয়।
ফেলিক্স ক্লিং 14

5
@ ফেলিক্সক্লিং ইএস 6 মডিউল লোডারকে ওপিতে ট্যাগ করা হয়েছিল তাই আমি ধরে নিয়েছি এটি এটিকে উত্তরের সাথে প্রাসঙ্গিক করে তুলেছে। এছাড়াও আমি বলেছি যে পর্যবেক্ষণের ভিত্তিতে অ্যাসিঙ্ক হ'ল বর্তমান আচরণ, পাশাপাশি ভবিষ্যতে সম্ভাবনা (কোনও বাস্তবায়নে) তাই এটি বিবেচনার জন্য একটি প্রাসঙ্গিক বিষয়। আপনি কি ভুল বলে মনে করেন?
অমিত

10
আমি মনে করি মডিউল লোডারের সাথে মডিউল সিস্টেম / সিনট্যাক্সের সংঘাত না করা গুরুত্বপূর্ণ। যেমন আপনি যদি নোডের জন্য বিকাশ করেন তবে আপনি সম্ভবত ES6 মডিউলগুলি যে requireকোনও উপায়ে সংকলন করছেন , সুতরাং আপনি নোডের মডিউল সিস্টেম এবং লোডারটি যেভাবেই ব্যবহার করছেন।
ফেলিক্স ক্লিং

41

প্রধান সুবিধাগুলি সিনট্যাকটিক:

  • আরও ঘোষিত / কমপ্যাক্ট সিনট্যাক্স
  • ইএস mod মডিউলগুলি মূলত ইউএমডি (ইউনিভার্সাল মডিউল সংজ্ঞা) অচল করে দেবে - মূলত কমনজেএস এবং এএমডি (সার্ভার বনাম ব্রাউজার) এর মধ্যে বিভেদ সরিয়ে দেয়।

আপনি ES6 মডিউলগুলির সাথে কোনও পারফরম্যান্স সুবিধা দেখতে পাচ্ছেন না। ব্রাউজারে ES6 বৈশিষ্ট্যগুলির জন্য সম্পূর্ণ সমর্থন থাকা সত্ত্বেও মডিউলগুলি বান্ডিল করার জন্য আপনার একটি অতিরিক্ত গ্রন্থাগার প্রয়োজন হবে।


4
ব্রাউজারগুলির পুরো ES6 মডিউল সমর্থন থাকা সত্ত্বেও কেন একটি বান্ডিলারের প্রয়োজন তা আপনি ব্যাখ্যা করতে পারেন?
ই সুন্দিন

1
ক্ষমা চাই, আরও অর্থবোধ করতে সম্পাদিত। আমি বোঝাতে চেয়েছিলাম যে আমদানি / রফতানি মডিউল বৈশিষ্ট্য কোনও ব্রাউজারে নেটিভালি প্রয়োগ করা হয় না। একটি ট্রান্সপোর্টার এখনও প্রয়োজন।
snozza

16
এটা আমার কাছে কিছুটা বিপরীত মনে হয়েছে। যদি পুরো সমর্থন থাকে তবে বান্ডিলারের উদ্দেশ্য কী? ES6 অনুপস্থিতিতে কিছু অনুপস্থিত রয়েছে? পুরোপুরি সমর্থিত পরিবেশে বান্ডলারটি এমন কী করবে যা উপলব্ধ নয় ?
ই সুন্দিন

1
যেমন @ স্নোজা বলেছিলেন ... "আমদানি / রফতানি মডিউল বৈশিষ্ট্য কোনও ব্রাউজারে সাদামাটাভাবে প্রয়োগ করা হয় না A একটি ট্রান্সপ্লেলার এখনও প্রয়োজন"
রবার্টমেইন

2
আপনার আর কোনও অতিরিক্ত লাইব্রেরির দরকার নেই। V8.5.0 (এক বছরেরও বেশি আগে প্রকাশিত হয়েছে) থেকে node --experimemntal-modules index.mjsআপনাকে importব্যাবেল ছাড়াই ব্যবহার করতে দেয় । আপনি পুরানো উপায়ে পিছনে সামঞ্জস্য সহ আপনার এনপিএম প্যাকেজগুলি স্থানীয় ইএসমডুল হিসাবে প্রকাশ করতে পারেন (এবং হওয়া উচিত) require। অনেক ব্রাউজার দেশীয়ভাবে গতিশীল আমদানি সমর্থন করে।
ড্যান ড্যাসক্লেস্কু

38

একে অপরকে ব্যবহার করে কি পারফরম্যান্স সুবিধা রয়েছে?

বর্তমান উত্তরটি হ'ল না, কারণ বর্তমান ব্রাউজার ইঞ্জিনগুলির import/exportকোনওটিই ES6 স্ট্যান্ডার্ড থেকে প্রয়োগ করে না।

কিছু তুলনা চার্ট http://kangax.github.io/compat-table/es6/ এটিকে বিবেচনায় নেবেন না, তাই যখন আপনি Chrome এর জন্য প্রায় সবুজ শাকসব্জী দেখেন, তবে সাবধান হন। importES6 থেকে কীওয়ার্ডটি আমলে নেওয়া হয়নি।

অন্য কথায়, ভি 8 সহ বর্তমান ব্রাউজার ইঞ্জিনগুলি কোনও জাভাস্ক্রিপ্ট নির্দেশিকার মাধ্যমে মূল জাভাস্ক্রিপ্ট ফাইল থেকে নতুন জাভাস্ক্রিপ্ট ফাইল আমদানি করতে পারে না ।

( V8 ES6 স্পেসিফিকেশন অনুযায়ী কার্যকর না হওয়া পর্যন্ত আমরা এখনও কয়েক বাগ দূরে বা কয়েক বছর দূরে থাকতে পারি))

এই দস্তাবেজটি আমাদের যা প্রয়োজন তা হ'ল এবং এই দস্তাবেজটি আমাদের অবশ্যই মানতে হবে।

এবং ES6 স্ট্যান্ডার্ড বলেছিল যে প্রোগ্রামিং ল্যাঙ্গুয়েজ সি-এর মতো মডিউলটি পড়ার আগে মডিউল নির্ভরতা থাকা উচিত, যেখানে আমাদের (শিরোনাম) .hফাইল ছিল।

এটি একটি ভাল এবং পরীক্ষিত কাঠামো এবং আমি নিশ্চিত যে ES6 স্ট্যান্ডার্ডটি তৈরি করেছেন এমন বিশেষজ্ঞরা মনে রাখবেন।

এটি হ'ল যা ওয়েবপ্যাক বা অন্যান্য প্যাকেজ বান্ডেলগুলিকে কিছু বিশেষ ক্ষেত্রে বান্ডিলটি অনুকূল করে তুলতে এবং প্রয়োজনীয় বান্ডেল থেকে কিছু নির্ভরতা হ্রাস করতে সক্ষম করে। তবে আমাদের ক্ষেত্রে নিখুঁত নির্ভরতা রয়েছে এটি কখনই ঘটবে না।

import/exportনেটিভ সাপোর্ট লাইভ না হওয়া পর্যন্ত এটির কিছুটা সময় প্রয়োজন হবে এবং requireকীওয়ার্ডটি দীর্ঘ সময় ধরে কোথাও যাবে না।

কী require?

এটি node.jsমডিউল লোড করার উপায়। ( https://github.com/nodejs/node )

নোড ফাইলগুলি পড়ার জন্য সিস্টেম-স্তরের পদ্ধতি ব্যবহার করে। আপনি ব্যবহার করার সময় মূলত এটির উপর নির্ভর করে require। জাভাস্ক্রিপ্ট ফাইল / মডিউল লোড করতে requireকিছু সিস্টেম কল যেমন uv_fs_open(শেষ ব্যবস্থার উপর নির্ভর করে, লিনাক্স, ম্যাক, উইন্ডোজ) in

এটি সত্য কিনা তা পরীক্ষা করতে, Babel.js ব্যবহার করার চেষ্টা করুন এবং আপনি দেখতে পাবেন যে importকীওয়ার্ডটি রূপান্তরিত হবে require

এখানে চিত্র বর্ণনা লিখুন


2
প্রকৃতপক্ষে, এমন একটি ক্ষেত্র রয়েছে যেখানে পারফরম্যান্সটি উন্নত করা যেতে পারে - বান্ডিল আকার। importওয়েবপ্যাক 2 / রোলআপ বিল্ড প্রক্রিয়াতে ব্যবহার করা ফলস্বরূপ 'ট্রি কাঁপানো' অব্যবহৃত মডিউল / কোড দ্বারা ফাইলের আকার হ্রাস করতে পারে যা অন্যথায় চূড়ান্ত বান্ডিলটিতে সক্রিয় হতে পারে। ছোট ফাইলের আকার = ডাউনলোডের জন্য দ্রুত = ক্লায়েন্টের দিকে আরম্ভ / কার্যকর করতে দ্রুত to
লি বেনসন

2
যুক্তিটি গ্রহের পৃথিবীতে কোনও বর্তমান ব্রাউজার ছিল না import মূলভাবে কীওয়ার্ডটির অনুমতি দেয় । বা এর অর্থ আপনি জাভাস্ক্রিপ্ট ফাইল থেকে অন্য একটি জাভাস্ক্রিপ্ট ফাইল আমদানি করতে পারবেন না। এ কারণেই আপনি এই দুটিয়ের পারফরম্যান্স সুবিধার তুলনা করতে পারবেন না। তবে অবশ্যই, ওয়েবপ্যাক 1/2 বা ব্রাউজারফাইয়ের মতো সরঞ্জামগুলি সংকোচনের সাথে মোকাবিলা করতে পারে। তারা গলায় ঘাড় আছেন: gist.github.com/substack/68f8d502be42d5cd4942
prosti থেকে

4
আপনি 'গাছের কাঁপুন' উপেক্ষা করছেন। আপনার সংক্ষিপ্ত লিঙ্কে কোথাও গাছ কাঁপানো আলোচিত নয়। ES6 মডিউলগুলি ব্যবহার করে এটি সক্ষম করে, কারণ importএবং exportএটি স্থির ঘোষণাগুলি যা একটি নির্দিষ্ট কোড পাথ আমদানি করে, যেখানে requireগতিশীল হতে পারে এবং এইভাবে ব্যবহার করা হয়নি এমন কোডগুলিতে বান্ডিল হয়। পারফরম্যান্স সুবিধাটি পরোক্ষ - ওয়েবপ্যাক 2 এবং / অথবা রোলআপের ফলে ছোট ছোট বান্ডিল আকারগুলি দ্রুত ডাউনলোড করতে পারে এবং ফলস্বরূপ শেষ ব্যবহারকারীর (ব্রাউজারের) কাছে তিনি উপস্থিত হন। এটি কেবলমাত্র তখনই কার্যকর হয় যদি সমস্ত কোড ES6 মডিউলগুলিতে লেখা থাকে এবং তাই আমদানি স্থিতিকরভাবে বিশ্লেষণ করা যায়।
লি বেনসন

2
আমি উত্তরটি উত্তর দিলাম লিবিসন, আমি মনে করি যদি আমরা ব্রাউজার ইঞ্জিনগুলির স্থানীয় সমর্থন বিবেচনা করি তবে আমরা এখনও তুলনা করতে পারি না। ওয়েবপ্যাকটি ব্যবহার করে হ্যান্ড থ্রি কাঁপানো বিকল্প হিসাবে কী আসে যায়, আমরা কমনজেএস মডিউলগুলি সেট করার আগেই অর্জন করা যেতে পারে, কারণ বেশিরভাগ আসল অ্যাপ্লিকেশনগুলির জন্য আমরা জানি যে কী মডিউলগুলি ব্যবহার করা উচিত।
prosti থেকে

1
আপনার উত্তর সম্পূর্ণ বৈধ, তবে আমি মনে করি আমরা দুটি ভিন্ন বৈশিষ্ট্য তুলনা করছি। সমস্ত import/export রূপান্তরিত হয় require, অনুমোদিত হয়। তবে এই পদক্ষেপের আগে যা ঘটেছিল তা "পারফরম্যান্স" উন্নত হিসাবে বিবেচনা করা যেতে পারে। উদাহরণ: যদি lodashES6 এ লেখা হয় এবং আপনি import { omit } from lodash, চূড়ান্ত বান্ডিলটি কেবল 'বাদ দেওয়া' এবং অন্যান্য ইউটিলিটিগুলিতে থাকবে না, তবে একটি সরল require('lodash')সবকিছুই আমদানি করবে। এটি বান্ডেলের আকার বাড়িয়ে তুলবে, ডাউনলোড করতে আরও সময় নিবে এবং ফলস্বরূপ হ্রাস পাবে। এটি অবশ্যই একটি ব্রাউজার প্রসঙ্গে অবশ্যই বৈধ।
লি বেনসন

31

ES6 মডিউলগুলি 'গাছের কাঁপুন' জন্য কার্যকর হতে পারে; যেমন ওয়েবপ্যাক 2 সক্ষম করুন, রোলআপ (বা অন্যান্য বান্ডেলর) কোড পাথগুলি সনাক্ত করতে যা ব্যবহার করা / আমদানি করা হয় না, এবং ফলস্বরূপ বান্ডেলে এটি তৈরি করে না। আপনার প্রয়োজন হবে না এমন কোড সরিয়ে এটি ফাইলের আকারকে উল্লেখযোগ্যভাবে হ্রাস করতে পারে তবে সাধারণ জেএসের সাথে ডিফল্টরূপে বান্ডিল হয় কারণ ওয়েবপ্যাক এট এর প্রয়োজন কিনা তা জানার কোনও উপায় নেই।

কোড পাথের স্থির বিশ্লেষণ ব্যবহার করে এটি করা হয়।

উদাহরণস্বরূপ, ব্যবহার করে:

import { somePart } 'of/a/package';

... বান্ডলারটি এমন একটি ইঙ্গিত দেয় যা package.anotherPartপ্রয়োজনীয় নয় (যদি এটি আমদানি না করা হয় তবে এটি সঠিকভাবে ব্যবহার করা যায় না?), সুতরাং এটি বান্ডিলিংয়ে বিরক্ত করবে না।

ওয়েবপ্যাক 2 এর জন্য এটি সক্ষম করতে, আপনাকে অবশ্যই নিশ্চিত করতে হবে যে আপনার ট্রান্সফারার কমনজেএস মডিউলগুলি ছড়িয়ে দিচ্ছে না। আপনি যদি es2015ব্যাবেল সহ প্লাগ-ইন ব্যবহার করছেন তবে আপনি এটি নিজের .babelrcমতো করে অক্ষম করতে পারেন:

{
  "presets": [
    ["es2015", { modules: false }],
  ]
}

রোলআপ এবং অন্যরা ভিন্নভাবে কাজ করতে পারে - আপনার আগ্রহী হলে ডক্সটি দেখুন।


2
এছাড়াও গাছ কম্পনের জন্য মহান 2ality.com/2015/12/webpack-tree-shaking.html
prosti থেকে

25

এটি যখন আসিঙ্ক বা সম্ভবত অলস লোডিংয়ের কথা আসে তখন এটি import ()অনেক বেশি শক্তিশালী। দেখুন যখন আমাদের অ্যাসিঙ্ক্রোনাস উপায়ে উপাদানটির প্রয়োজন হয়, তারপরে আমরা importএটিকে constচলক ব্যবহারের মতো কিছু অ্যাসিঙ্ক পদ্ধতিতে ব্যবহার করি await

const module = await import('./module.js');

বা আপনি যদি require()তখন ব্যবহার করতে চান ,

const converter = require('./converter');

জিনিস import()প্রকৃতির প্রকৃতপক্ষে async হয়। মধ্যে neehar venugopal উল্লেখ হিসাবে ReactConf , আপনি এটি পরিবর্তনশীল লোড করতে ব্যবহার করতে পারেন ক্লায়েন্ট সাইড আর্কিটেকচারের জন্য উপাদান প্রতিক্রিয়া জানিয়েছে।

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

একই জন্য যায় export: ES6 exportহ'ল কমনজেএসের মতো module.exports

দ্রষ্টব্য - আপনি যদি নোড.জেএস প্রকল্পটি বিকাশ করছেন তবে আপনাকে কঠোরভাবে ব্যবহার করতে require()হবে নোড ব্যতিক্রমী ত্রুটি ছুঁড়ে দেবে যেমন invalid token 'import'আপনি ব্যবহার করবেন import। সুতরাং নোড আমদানি বিবৃতি সমর্থন করে না।

আপডেট - ড্যান ড্যাসক্লেসকু দ্বারা প্রস্তাবিত : যেহেতু v8.5.0 (সেপ্টেম্বর 2017 প্রকাশিত হয়েছে), node --experimental-modules index.mjsআপনাকে importবাবেল ছাড়াই ব্যবহার করতে দেয় । আপনি পুরানো উপায়ে পিছনে সামঞ্জস্য সহ আপনার এনপিএম প্যাকেজগুলি স্থানীয় ইএসমডুল হিসাবে প্রকাশ করতে পারেন (এবং হওয়া উচিত) require

অ্যাসিঙ্ক আমদানিগুলি কোথায় ব্যবহার করতে হবে তা আরও ছাড়পত্রের জন্য এটি দেখুন - https://www.youtube.com/watch?v=bb6RCrDaxhw


1
সুতরাং প্রয়োজনীয়তা সিঙ্ক হয়ে অপেক্ষা করবে?
বাকলাজান

1
সত্যি বলতে পারি!
জাভেরির সাথে সাক্ষাত করুন

15

সর্বাধিক গুরুত্বপূর্ণ বিষয়টি হ'ল ES6 মডিউলগুলি প্রকৃতপক্ষে একটি সরকারী মান, যখন কমনজেএস (নোড.জেএস) মডিউলগুলি নয়।

2019 সালে, ES6 মডিউলগুলি ব্রাউজারগুলির 84% দ্বারা সমর্থিত । নোড.জেএস তাদের একটি - এক্সপেরিমেন্টাল-মডিউলগুলির পতাকার পিছনে রাখে , সেখানে এসএম নামে একটি সুবিধাজনক নোড প্যাকেজও রয়েছে , যা সংহতটিকে মসৃণ করে তোলে।

এই মডিউল সিস্টেমগুলির মধ্যে আপনি যে সমস্যার সমাধান করতে পারেন তা হ'ল কোড অবস্থান। নোড.জেএস অনুমান করে উত্সটি একটি node_modulesডিরেক্টরিতে রাখা হয় , যখন বেশিরভাগ ES6 মডিউলগুলি ফ্ল্যাট ডিরেক্টরি কাঠামোতে স্থাপন করা হয়। এগুলি পুনর্মিলন করা সহজ নয়, তবে এটি package.jsonপূর্বের এবং পোস্ট ইনস্টলেশন স্ক্রিপ্টগুলির সাহায্যে আপনার ফাইল হ্যাক করে করা যেতে পারে । এখানে আইসোমর্ফিক মডিউল এবং এটি কীভাবে কাজ করে তা ব্যাখ্যা করার জন্য একটি নিবন্ধ দেওয়া আছে


8

আমি ব্যক্তিগতভাবে আমদানি ব্যবহার করি কারণ, আমরা প্রয়োজনীয় পদ্ধতিগুলি, আমদানি ব্যবহার করে সদস্যগুলি আমদানি করতে পারি।

import {foo, bar} from "dep";

ফাইলের নাম : dep.js

export foo function(){};
export const bar = 22

কৃতিত্ব পল শানের কাছে যায়। আরও তথ্য



6
আপনি প্রয়োজন সঙ্গে একই করতে পারেন!
সুয়েস

4
const {a,b} = require('module.js'); পাশাপাশি কাজ করে ... আপনি যদি রফতানি করেন aএবংb
কলাঅ্যাসিড

module.exports = { a: ()={}, b: 22 }- @ বনানাএসিড রিসোনসের দ্বিতীয় অংশ
শেঠ ম্যাকক্লেইন

7

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

ES6 → import, export default, export

কমনজেএস → require, module.exports, exports.foo

নীচে সেগুলির সাধারণ ব্যবহার রয়েছে।

ES6 রফতানি ডিফল্ট

// hello.js
function hello() {
  return 'hello'
}
export default hello

// app.js
import hello from './hello'
hello() // returns hello

ES6 একাধিক রফতানি করে এবং একাধিক আমদানি করে

// hello.js
function hello1() {
  return 'hello1'
}
function hello2() {
  return 'hello2'
}
export { hello1, hello2 }

// app.js
import { hello1, hello2 } from './hello'
hello1()  // returns hello1
hello2()  // returns hello2

কমনজেএস মডিউল.এক্সপোর্টস

// hello.js
function hello() {
  return 'hello'
}
module.exports = hello

// app.js
const hello = require('./hello')
hello()   // returns hello

কমনজেএস মডিউল.এক্সপোর্ট একাধিক

// hello.js
function hello1() {
  return 'hello1'
}
function hello2() {
  return 'hello2'
}
module.exports = {
  hello1,
  hello2
}

// app.js
const hello = require('./hello')
hello.hello1()   // returns hello1
hello.hello2()   // returns hello2

0

নিশ্চিত না কেন (সম্ভবত অপ্টিমাইজেশন - অলস লোডিং?) এটি এমনভাবে কাজ করছে তবে আমি লক্ষ্য করেছি যে importআমদানি করা মডিউলগুলি ব্যবহার না করা হলে কোড পার্স করতে পারে না।
যা কিছু ক্ষেত্রে আচরণের আশা করা যায় না।

ঘৃণিত ফু ক্লাসটিকে আমাদের নমুনা নির্ভরতা হিসাবে গ্রহণ করুন।

foo.ts

export default class Foo {}
console.log('Foo loaded');

উদাহরণ স্বরূপ:

index.ts

import Foo from './foo'
// prints nothing

index.ts

const Foo = require('./foo').default;
// prints "Foo loaded"

index.ts

(async () => {
    const FooPack = await import('./foo');
    // prints "Foo loaded"
})();

অন্য দিকে:

index.ts

import Foo from './foo'
typeof Foo; // any use case
// prints "Foo loaded"
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.