如何将 Svelte 组件导入 JS 文件

Question

我正在开发一个同时使用原生 JS 和 Svelte 的项目。我开发了一个 Svelte 组件，我想知道以后如何将其导入我的 JS 文件。

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

Answer 1

如果您使用的是 JavaScript ES6，则导入 svelte 的语法和其他任何内容如下：

const svelte = require('svelte')

Answer 2

你可以简单地做

import MyComponent from 'MyComponent.svelte'

创建它的一个实例，然后你会做

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

Answer 3

并且不要忘记通过简单地添加更新 rollup.config.js 文件：

import svelte from "rollup-plugin-svelte";

和

svelte()

在插件数组中像这样：

plugin : [
svelte()

]

如何将 Svelte 组件导入 JS 文件

How to import a Svelte component into a JS file

javascript

svelte

rollup