polymer-decorators
polymer-decorators copied to clipboard
Add more docs on working with Typescript + Polymer
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.
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.
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.
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