HTML tagged template literal
npm install @nicolasparada/html-tag@nicolasparada/html-tagjs
import html from 'https://unpkg.com/@nicolasparada/html-tag'
const template = html
class HelloWorld extends HTMLElement {
constructor() {
super()
this.attachShadow({ mode: 'open' })
}
connectedCallback() {
this.shadowRoot.appendChild(template.content.cloneNode(true))
}
}
customElements.define('hello-world', HelloWorld)
`
This function will create an HTMLTemplateElement. It's meant to give just syntax highlighting.
If you try to use it inside itself again, it will pay the cost of creating a template again and getting its innerHTML. So, use a normal string or something like String.raw.
Instead of:
`js
html
- ${item}
)}
`
Do:
`js
html
- ${item}
``