Re-exporting ES6 modules in TS 1.7?

2020-02-10 03:49发布

问题:

I'm getting a bit lost in TS re-exports. Say I create a pair of test modules;

test1.ts;

export function test1() {
    return 'test';
}

test2.ts;

export function test2() {
    return 'test';
}

I believe I should be able to then do something like this;

combined.ts;

export * from './test1';
export * from './test2';

module.exports = {
    test1: test1,
    test2: test2
};

But, no such luck. There seem to be lots of GitHub issues discussing various approaches to this, including an old hack using export import * from './test1' but they all seem to argue what the ES6 spec really means, and none actually work..

What's the right way to do a rollup like this? Am I just going down the wrong path to split a module up across files? Are namespaces more appropriate here?

回答1:

You shouldn’t be using module.exports when you are working with ES modules; module.exports is a part of CommonJS modules, not a part of EcmaScript modules.

Rollup, exporting directly

Your correct rollup module will simply be:

export * from './test1';
export * from './test2';

Then to use the rollup:

import * as rollup from './combined';
// or `import { test1, test2 } from './combined'`;
// or any other valid import

rollup.test1();
rollup.test2();

Rollup, adding namespace objects

If you want to export test1 and test2 with extra namespacing then use export {} syntax:

import * as test1 from './test1';
import * as test2 from './test2';
export { test1, test2 };

Then usage becomes:

import * as rollup from './combined';
rollup.test1.test1();
rollup.test2.test2();

Rollup, using different export names

You can also redirect names using as if you have some name conflict, just like with import:

export { test1 as t1 } from './test1';
export { test2 as t2 } from './test2';

Then usage becomes:

import * as rollup from './combined';
rollup.t1();
rollup.t2();


回答2:

It looks like you can not export everything in a module using *, not even if you use * as localModuleName.

Instead you have to name what your the combined module exports from the other modules.

// combined.ts
export {test1, test3} from './test1'; 
export {test2} from './test2';