polymer-decorators icon indicating copy to clipboard operation
polymer-decorators copied to clipboard

Add more docs on working with Typescript + Polymer

Open LarsDenBakker opened this issue 7 years ago • 3 comments

There are some quirks when working with Polymer 2 and typescript, especially when using it to develop separately shareable components and not applications. I think it would be good to collect some knowledge on how this is done.

My current workflow consists of:

  • Write .ts files, compile them to .js and include the .js file in a script tag in my .html file. Unfortunately that results
  • I use typescript namespaces, as modules are not supported at runtime by polymer tooling
  • I use the "noEmitHelpers" option in my tsconfig to prevent small helper functions popping up in every .js file. I then include tslib (https://github.com/Microsoft/tslib) globally. If we were using modules, we could have used the "importHelpers" which is the most documented configuration. This does not work with namespaces however, and it will still emit the helper functions. Eventually I found the "noEmitHelpers" option but it is not very well documented.

All in all it's a bit cumbersome, so I'm wondering if there are better workflows.

LarsDenBakker avatar Jan 09 '18 08:01 LarsDenBakker

We're not going to be investing further in 2.x support for this library, so we recommend moving to Polymer 3.0 and using the new https://www.npmjs.com/package/@polymer/decorators package.

aomarks avatar Aug 11 '18 00:08 aomarks

For anyone who comes across this, I put together a small Polymer 2 + Typescript + Webpack + polymer-decorators with Javascript modules support here: https://github.com/yebrahim/polymer2-typescript-webpack, hope it might help.

yebrahim avatar Aug 11 '18 00:08 yebrahim

Actually let's keep this open, it could still be useful to have some more practical docs around usage with 3.0. See also https://github.com/Polymer/docs/issues/2439

aomarks avatar Aug 12 '18 16:08 aomarks