बहुत बढ़िया मुगल! यह होना चाहिए की तुलना में कठिन था।
एक फ्लैट डिफ़ॉल्ट निर्यात करें
यह उपयोग करने के लिए एक महान अवसर है प्रसार ( ...में { ...Matters, ...Contacts }नीचे:
// imports/collections/Matters.js
export default { // default export
hello: 'World',
something: 'important',
};
// imports/collections/Contacts.js
export default { // default export
hello: 'Moon',
email: 'hello@example.com',
};
// imports/collections/index.js
import Matters from './Matters'; // import default export as var 'Matters'
import Contacts from './Contacts';
export default { // default export
...Matters, // spread Matters, overwriting previous properties
...Contacts, // spread Contacts, overwriting previosu properties
};
// imports/test.js
import collections from './collections'; // import default export as 'collections'
console.log(collections);
फिर, कमांड लाइन (प्रोजेक्ट रूट /) से बेबल संकलित कोड चलाने के लिए :
$ npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/node
(trimmed)
$ npx babel-node --presets @babel/preset-env imports/test.js
{ hello: 'Moon',
something: 'important',
email: 'hello@example.com' }
एक पेड़ की तरह डिफ़ॉल्ट निर्यात करें
यदि आप गुणों को अधिलेखित नहीं करना चाहते हैं, तो परिवर्तन करें:
// imports/collections/index.js
import Matters from './Matters'; // import default as 'Matters'
import Contacts from './Contacts';
export default { // export default
Matters,
Contacts,
};
और उत्पादन होगा:
$ npx babel-node --presets @babel/preset-env imports/test.js
{ Matters: { hello: 'World', something: 'important' },
Contacts: { hello: 'Moon', email: 'hello@example.com' } }
कई नामित निर्यातों को निर्यात करें w / कोई डिफ़ॉल्ट नहीं
यदि आप DRY के लिए समर्पित हैं , तो आयात में सिंटैक्स भी बदलता है:
// imports/collections/index.js
// export default as named export 'Matters'
export { default as Matters } from './Matters';
export { default as Contacts } from './Contacts';
यह 2 नामित निर्यात w / कोई डिफ़ॉल्ट निर्यात बनाता है। फिर बदलें:
// imports/test.js
import { Matters, Contacts } from './collections';
console.log(Matters, Contacts);
और आउटपुट:
$ npx babel-node --presets @babel/preset-env imports/test.js
{ hello: 'World', something: 'important' } { hello: 'Moon', email: 'hello@example.com' }
सभी नामित निर्यात आयात करें
// imports/collections/index.js
// export default as named export 'Matters'
export { default as Matters } from './Matters';
export { default as Contacts } from './Contacts';
// imports/test.js
// Import all named exports as 'collections'
import * as collections from './collections';
console.log(collections); // interesting output
console.log(collections.Matters, collections.Contacts);
पिछले उदाहरण में विनाशकारी सूचना import { Matters, Contacts } from './collections';।
$ npx babel-node --presets @babel/preset-env imports/test.js
{ Matters: [Getter], Contacts: [Getter] }
{ hello: 'World', something: 'important' } { hello: 'Moon', email: 'hello@example.com' }
प्रयोग में
इन स्रोत फ़ाइलों को देखते हुए:
/myLib/thingA.js
/myLib/thingB.js
/myLib/thingC.js
एक बनाना /myLib/index.jsसभी फाइलों को बंडल करने आयात / निर्यात के प्रयोजन को हरा दिया। पहली जगह में सब कुछ वैश्विक बनाना आसान होगा, सब कुछ आयात / निर्यात के माध्यम से वैश्विक करने के बजाय index.js "रैपर फ़ाइलों" के माध्यम से।
यदि आप import thingA from './myLib/thingA';अपनी खुद की परियोजनाओं में एक विशेष फ़ाइल चाहते हैं।
मॉड्यूल के लिए निर्यात के साथ "रैपर फ़ाइल" बनाना केवल तभी समझ में आता है जब आप npm के लिए पैकेजिंग कर रहे हैं या एक बहु-वर्षीय मल्टी-टीम प्रोजेक्ट पर।
इसे दूर किया? देखें डॉक्स अधिक जानकारी के लिए।
इसके अलावा, स्टैकओवरफ़्लो के लिए याय अंत में कोड बाड़ मार्कअप के रूप में तीन `का समर्थन करता है।