title: How can I get Web Components to compile with TypeScript for IE11/Edge/Chrome/Firefox?
body: <p>Having set up a web project to use TypeScript/WebPack I cannot get Google Chrome to run the result:</p>
  
  <p><a href="https://i.stack.imgur.com/KUNm8.png" rel="noreferrer"><img src="https://i.stack.imgur.com/KUNm8.png" alt="enter image description here"></a></p>
  
  <p>The error reads: <kbd>"Uncaught TypeError: Failed to construct 'HTMLElement': Please use the 'new' operator, this DOM object constructor cannot be called as a function."</kbd></p>
  
  <p>I learned that <a href="https://stackoverflow.com/questions/39037489/extending-htmlelement-constructor-fails-when-webpack-was-used">a shim is required</a> for transpiling to ES5, but I still can't get this to work. That's probably because I don't want to add a &lt;script> element to the HTML but instead I want to <code>import "../node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle";</code> in my <code>.ts</code> files.</p>
  
  <p>How can I get this to work without adding &lt;script> elements to my HTML files?</p>
  
  <p>I took my <code>tsconfig.json</code> and <code>webpack.config.js</code> files from <a href="https://webpack.js.org/guides/typescript/" rel="noreferrer">this tutorial</a>.</p>