Suggestion: Module code generation UMD

[codler]

Add a third variant umd (Universal Module Definition) in module flag on compiler.

tsc --module umd

This way you can reuse your JS code in both Nodejs and Browser without needing to compile twice (amd and commonjs) and still be able to code modular style (import/export) in TS.

[danquirk]

We would need a better understanding of how many people are using this module style before doing the work to support it. Do you have any examples of large projects using this?

[codler]

Yes, many large projects are having there own style of umd.
Example

• jQuery
• LESS.js
• Underscore.js
• D3.js
• Leaflet
• Backbone.js
• Knockout
• Ractive.js

[coreh]

6to5 Babel also supports emitting UMD code:

https://babeljs.io/docs/usage/modules/

[fdecampredon]

note that emitting true umd is quite problematic not only you have to grasp the names of modules for the global case (aka 'react' becomes React) but you have to changes ALL the require call with something like derequire to prevents amd loader that parse require from breaking.

[csnover]

note that emitting true umd is quite problematic not only you have to grasp the names of modules for the global case (aka 'react' becomes React) but

Eh? Are you meaning that in order to output a global object you normally need to specify a different variable name for it?

you have to changes ALL the require call with something like derequire to prevents amd loader that parse require from breaking.

Not 100% sure what you are talking about here. There was a bug in a very old version of the example UMD wrapper code, but there is nothing that requires a UMD module to do factory scanning.

[edits: sorry, it’s way too late for me to be posting things on github 😴 ]

[fdecampredon]

Not 100% sure what you are talking about here. There was a bug in a very old version of the example UMD wrapper code, but there is nothing that requires a UMD module to do factory scanning.

Some AMD loader scans your file for require call and try to look for dependencies based on that scanning so you have to derequire your file in some case.

Eh? Are you meaning that in order to output a global object you normally need to specify a different variable name for it?

Yup exactly UMD also manages global objects so you'll have to provide the module with 2 names.

[csnover]

Yup exactly UMD also manages global objects so you'll have to provide the module with 2 names.

Maybe TS can get away with outputting a UMD lite format that is just CJS-or-AMD, since the compiler already will not let you export external modules if you don’t specify a module format? I think that’s really what people want anyway, just something that works with a browser module loader and works with the built-in Node.js loader, so we can get away from the stupidity of having to either load an AMD loader into Node.js to load AMD-format modules, or run Browserify to mostly-load CJS-format modules in a browser, or double compilation for each platform.

[pocesar]

nice timing. I'm having to create a manual header and footer on the compiled .js file that wraps the UMD header and the factory function at the bottom. (and add a module.exports hack, setting module to commonjs)

[mhegazy]

Thanks @csnover

[bryanforbes]

Will this be available in 1.5?

[mhegazy]

This is going to be available in 1.6 1.5

[benlesh]

When is 1.6 alpha/beta coming? I'd really like this feature for the redevelopment of RxJS 3...

[mhegazy]

Correction it should be available in the next public release for 1.5; you can use the latest from master or release-1.5 as well.

[benlesh]

@mhegazy ... so just ---module umd ?

[mhegazy]

yup.

[Zorgatone]

Wow I just realized I can use UMD now 😄