observablehq / htl

A tagged template literal that allows safe interpolation of values into HTML, following the HTML5 spec
https://observablehq.com/@observablehq/htl
ISC License
305 stars 24 forks source link

How to use htl #41

Open data-compute-geek opened 2 years ago

data-compute-geek commented 2 years ago

Hi,

I installed the htl through npm, and want to use it in my browser. I have tried various methods and just could not make it work. Can anyone give me a hand?

I thought I read somewhere I can put some code as the following in my html

But no matter what, I cannot find it anywhere.

I would like to be able to use something like htl.svg, and htl.html in my scripts. How do I import htl ?

Thanks. Sean

lionel-rowe commented 1 year ago

If you want to include NPM modules directly in your front-end code, consider using esm.sh along with native JS modules:

<script type="module">
import { html } from "https://esm.sh/htl@0.3.1"
document.body.appendChild(html`<h1>imported successfully`)
</script>
Hvass-Labs commented 9 months ago

The following works on my web-page:

<script src="https://cdn.jsdelivr.net/npm/htl@0.3.1"></script>

Then I can use e.g. htl.html and htl.svg