3 ms·
Types are cool, TypeScript is cool, and types with JSDocs are cool, https://dev.to/dakmor/type-safe-web-components-with-jsdoc-4icf https://dev.to/dakmor/type-sa
by westbrookjo 7y ago
Types are cool, TypeScript is cool, and types with JSDocs are cool, https://dev.to/dakmor/type-safe-web-components-with-jsdoc-4icf https://dev.to/dakmor/type-safe-web-components-with-jsdoc-4i... and what's more, they're all cool with web components.
- AaronFriel 7y agoI'm confused, I scrolled down and still saw this: return html` <h1>${this.format(this.title)}</h1> <div class="dot" style=${`left: ${this.bar.x}px; top: ${this.bar.y}`} title=${this.bar.title} ></div> `; That is not type checked. I can change any of the HTML tags in there, any of the attributes on the HTML tags, I can make the template ill-formed HTML, and nothing in my editor or build system will check that. const el = /** @type {TitleBar} */ (document.querySelector('title-bar')); Why would I do that instead of this, if I'm using TypeScript? const el: TitleBar = document.querySelector('title-bar'); Moreover, this is an unsafe type coercion, we have no witness that the return value is a TitleBar. document.querySelector returns an HTMLElement, and if you were using strict TypeScript types this assignment would not type check.
- no_way 7y agoThere exists plugin for VSCode which checks for attributes inside template literal https://marketplace.visualstudio.com/items?itemName=runem.lit-plugin https://marketplace.visualstudio.com/items?itemName=runem.li...
- AaronFriel 7y agoThat looks extremely useful though it's definitely in the "early adopter" phase of utility. It looks like this extension and the underlying TypeScript plugin that allows typechecking are being developed by a single person, and I think a team or individual would have to make a judgment call on whether to depend on it.