如何将 Svelte 组件导入 JS 文件
How to import a Svelte component into a JS file
我正在开发一个同时使用原生 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>
如果您使用的是 JavaScript ES6,则导入 svelte 的语法和其他任何内容如下:
const svelte = require('svelte')
你可以简单地做
import MyComponent from 'MyComponent.svelte'
创建它的一个实例,然后你会做
new MyComponent({
target: mountpoint // here the dom node where you want to mount it
})
并且不要忘记通过简单地添加更新 rollup.config.js 文件:
import svelte from "rollup-plugin-svelte";
和
svelte()
在插件数组中
像这样:
plugin : [
svelte()
]
我正在开发一个同时使用原生 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>
如果您使用的是 JavaScript ES6,则导入 svelte 的语法和其他任何内容如下:
const svelte = require('svelte')
你可以简单地做
import MyComponent from 'MyComponent.svelte'
创建它的一个实例,然后你会做
new MyComponent({
target: mountpoint // here the dom node where you want to mount it
})
并且不要忘记通过简单地添加更新 rollup.config.js 文件:
import svelte from "rollup-plugin-svelte";
和
svelte()
在插件数组中 像这样:
plugin : [
svelte()
]