How to deploy / use lit-html, lit-element on a live web server
Question
I started trying out lit-html and lit-elements, playing around with it and now I git in the problem where I cannot find out how to publish such code online. Never worked with Node-js packages on online platforms, only used bits of code from it. Normaly I build plain php/html templates, but I wanna try this.
Build some test cases localy that work. But googled all over the place to find out how i can publish this kind of code online to the internet. I am using a shared hosting with many options like SSH eg But can't find out what to do to get this working, it can't be as simple as running npm install on my server right?
1 answers
solution1
0 2019-09-08 23:08:39
the best thing about the new world of web components, and lit-html and friends, is that we don't actually need npm, we don't need compilation, or any build step at all
these days, we can use es-modules to load things straight from a CDN like unpkg or jsdelivr
take a look at the demo on haunted's github readme — this is all you need!
<!doctype html>
<html lang="en">
<my-counter></my-counter>
<script type="module">
import { html } from 'https://unpkg.com/lit-html/lit-html.js';
import { component, useState } from 'https://unpkg.com/haunted/haunted.js';
function Counter() {
const [count, setCount] = useState(0);
return html`
<div id="count">${count}</div>
<button type="button" @click=${() => setCount(count + 1)}>Increment</button>
`;
}
customElements.define('my-counter', component(Counter));
</script>
check it out running live on this codepen example
👋 Chase
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.