duodvk duodvk - 1 month ago 21
TypeScript Question

Webpack: How to hide export functions/variables under one global variable?

I am changing the way a TypeScript library is building, from gulp concat + typescript compiler to Webpack.

The library now can be used with

require/import
key words. However, I have to leave the ability to use a library in a classic way, including script into html header.

Before all functions/variables were hidden under the global variable
Survey
. To make it happen the typescript
namespace Survey {}
was used and all require classes/variables use
export
key word.

I had to remove the namespace and now, to achieve the same, having one global variable, I have to include all needed export classes/variables into the build entry point file:

https://github.com/dmitrykurmanov/surveyjs/blob/bd62cd7388960a0230767b3bcf97e6332ee99cf3/src/entries/koBootstrapIndex.js

Is any other way to achieve the same, without creating this huge list?

Answer

Instead of importing, combining into an object literal and then re-exporting (via module.exports) you can use ES6 re-exports:

import … from …
export … // module.exports = {…};

becomes

export … from …

So you still have to build a list of identifiers, but you don't have to repeat them any more.

Comments