Как развернуть / использовать lit-html, lit-element на живом веб-сервере

Я начал опробовать lit-html и lit-elements, поэкспериментировать с ними, и теперь я сталкиваюсь с проблемой, когда не могу найти способ опубликовать такой код в Интернете. Никогда не работал с пакетами Node-js на онлайн-платформах, использовал только кусочки кода из него. Обычно я создаю простые шаблоны php/html, но я хочу попробовать это.

Постройте несколько тестовых случаев, которые работают. Но повсюду гуглил, чтобы узнать, как я могу опубликовать этот вид кода онлайн в интернете. Я использую общий хостинг со многими опциями, такими как SSH, например. Но я не могу узнать, что нужно сделать, чтобы это работало, это не так просто, как запустить npm install на моем сервере, верно?

Источник

0 ответов

Лучшее в новом мире веб-компонентов, lit-html и других заключается в том, что нам на самом деле не нужен npm, нам не нужна компиляция или какой-либо этап сборки вообще

в наши дни мы можем использовать es-модули для загрузки вещей прямо из CDN, например unpkg или jsdelivr

взгляните на демонстрацию в readme github haunted - это все, что вам нужно!

<!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>

проверьте это в реальном времени на этом примере кода

гнаться

Источник
Другие вопросы по тегам