Register Svelte components as custom elements.
First, you need to be familiar with Svelte. Read the guide if you haven't already, then come back here!
Install svelte-custom-elements to your project...
npm install -S svelte-custom-elements...then use it in your app like so:
import Counter from './Counter.html';
import { register } from 'svelte-custom-elements';
register( 'my-component', Counter, [ 'value' ] );
document.body.innerHTML = '<my-component value="42"></my-component>';The register function takes three arguments:
- The tag name you wish to use
- A Svelte component constructor
- An optional list of 'observed attributes'. Any properties that you want to get or set (i.e.
component.thing = 'foo') must be included in this list.
MIT