Büyük çirkin muglys! Bu olması gerekenden daha zordu.
Bir sabit varsayılanı dışa aktar
Bu kullanmak için harika bir fırsattır yayılmasını ( ...içinde { ...Matters, ...Contacts }aşağıda:
// 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);
Ardından, komut satırından babil derlenmiş kodunu çalıştırmak için (proje kökünden /):
$ 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' }
Bir ağaç benzeri varsayılanı dışa aktarma
Mülklerin üzerine yazmamayı tercih ederseniz, şunları değiştirin:
// imports/collections/index.js
import Matters from './Matters'; // import default as 'Matters'
import Contacts from './Contacts';
export default { // export default
Matters,
Contacts,
};
Ve çıktı:
$ npx babel-node --presets @babel/preset-env imports/test.js
{ Matters: { hello: 'World', something: 'important' },
Contacts: { hello: 'Moon', email: 'hello@example.com' } }
Birden fazla adlandırılmış dışa aktarmayı varsayılan olmadan dışa aktar
Eğer adanmış ediyorsanız DRY , ithalata sözdizimi de değişir:
// imports/collections/index.js
// export default as named export 'Matters'
export { default as Matters } from './Matters';
export { default as Contacts } from './Contacts';
Bu, varsayılan dışa aktarma olmadan 2 adlandırılmış dışa aktarma oluşturur. Sonra değiştirin:
// imports/test.js
import { Matters, Contacts } from './collections';
console.log(Matters, Contacts);
Ve çıktı:
$ npx babel-node --presets @babel/preset-env imports/test.js
{ hello: 'World', something: 'important' } { hello: 'Moon', email: 'hello@example.com' }
Tüm adlandırılmış dışa aktarmaları içe aktar
// 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);
Önceki örnekteki yıkıma dikkat edin 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' }
Uygulamada
Bu kaynak dosyalar göz önüne alındığında:
/myLib/thingA.js
/myLib/thingB.js
/myLib/thingC.js
/myLib/index.jsTüm dosyaları paketlemek için a oluşturmak , alma / verme amacını bozar. İndex.js "sarmalayıcı dosyaları" aracılığıyla içe aktarma / dışa aktarma yoluyla her şeyi küresel hale getirmekten daha önce her şeyi küresel yapmak daha kolay olacaktır.
Belirli bir dosya istiyorsanız import thingA from './myLib/thingA';, kendi projelerinizde.
Modül için dışa aktarmalarla bir "sarma dosyası" oluşturmak yalnızca npm için paketleme yapıyorsanız veya çok yıllı çok ekipli bir projede mantıklıdır.
Şimdiye kadar mı yaptınız? Daha fazla ayrıntı için dokümanlara bakın.
Ayrıca Stackoverflow için yay nihayet kod çit biçimlendirme olarak üç `ü destekliyor.