1

I'm working on a number of NPM packages in TypeScript and I'm wondering about the best way to support different target architectures.

If you compile to ES3, you have the widest support, but also additional boilerplate for compatibility (size, partially impossible to parse). If you target esnext, you basically have no boilerplate (clean output code!), but very limited support.

The problem is that the TypeScript compiler does not transpile JS code or any code from node_modules in general. Hence, if you e.g. compile a library to ES6 and someone wants to use it in their browser app (targeting ES3 or ES5), then they wouldn't be able to just use that library.

What is the best practice here? How should I configure my package.json and tsconfig.json? And if the library user will need to do something, what's the preferred way here?

Thanks a lot!

gfmio
  • 33
  • 3
  • 1
    Why does it matter if it's TS emitting the JS? "What level of ES compat should I write my JS in?" is a compiler-agnostic question. – Ryan Cavanaugh Mar 03 '18 at 01:16

1 Answers1

0

I think there can be compromise. For me the main reason to use es6 in the library - to support rollup's tree-shaking. For this the package.json has option module:

"main": "dist/alina-core.js",
"module": "dist/alina-core-es.js",

When user uses rollup, it will be required to transpile to ES5 after tree-shaking anyway, so, in module specified ES6 version. But if library user uses old build pipeline, he will get main transpiled ES5 version.

Pavel
  • 2,602
  • 1
  • 27
  • 34
  • Note that in older version of webpack, the `module` field can cause problem. If your dependency has `module` field and you want to get es5, it gets the es6 version. I haven't check the latest version. Hope it is fixed. – unional Mar 03 '18 at 07:38