javascriptsvelterollup

How to import a Svelte component into a JS file

I'm working on a project using both of native JS and Svelte. And I worked on a Svelte component and I want to know how can I import this later into my JS file.

*index.js*
// js code here 
alert('here is my sweet Svelte compoent');
-- the svelte component must be here ---
...
//

**MyComponent.svelte**

<script>
   ... the Svelte code ...
</script>
<style>
   ... the Svelte component's style ...
</style>
<div>
   ...
   ...
</div>
Solution

  • You can simply do

    import MyComponent from 'MyComponent.svelte'

    to create an instance of it you would then do

    new MyComponent({
  target: mountpoint // here the dom node where you want to mount it
})