Esportazione predefinita e denominata ES6

Question

Sto cercando di capire le esportazioni denominate e predefinite. Ho un requisito apparentemente di base che non capisco come configurare.

Voglio essere in grado di importare sia:

//app.js 
import Mod from './my-module' 
import { funcA, funcB } from './my-module' 

console.log('A', Mod.funcA(), funcA()); // A a a 
console.log('B', Mod.funcB(), funcB()); // A a a 

Quando provo, il modo più vicino di fare questo ho raggiungere è la seguente:

//my-module.js 
export function funcA() { return 'a'; }; 
export function funcB() { return 'b'; }; 

export default {funcA, funcB} 

Il mio problema è che io don Non voglio reindicizzare ogni funzione nell'esportazione predefinita. Voglio solo definire le mie funzioni e quindi assicurarmi che vengano esportate in modo da poterle usare in entrambi i modi.

Suggerimenti? O devo usare import * as Mod from './my-module';? contenuti

Answer 1

È possibile omettere l'esportazione predefinita e utilizzare l'importazione come sintassi:

//app.js 
import * as Mod from './my-module' 
import { funcA, funcB } from './my-module' 

console.log('A', Mod.funcA(), funcA()); // A a a 
console.log('B', Mod.funcB(), funcB()); // B b b 

//my-module.js 
export function funcA() { return 'a'; }; 
export function funcB() { return 'b'; }; 

Answer 2

Importa intera del modulo una volta utilizzando * as name:

import * as Mod from './my-module'; 

Quindi assegnare loro di separare le costanti utilizzando destrutturazione:

const { funcA, funcB } = Mod; 

Per l'esportazione basta usare l'esportazioni nome:

export function funcA() { return 'a'; }; 
export function funcB() { return 'b'; };