如何使用 NPM 使用 SFonte 中的 jQuery 和数据表

Question

我正在尝试使用来自svelte的DataTables jQuery插件，我想避免将它们包含在我的索引中.html。我想从 npm 引用它。

我试过这个：

<script>
import { onMount } from 'svelte'
import jQuery from 'jquery'
import dt from 'datatables.net'
import dtCss from 'datatables.net-dt'
dt(jQuery)
export let values = []
let tableElement
onMount( () => jQuery(tableElement).DataTable() )
</script>
<table bind:this={tableElement} border="1px">
<thead>
<tr>
<th>values</th>
</tr>
</thead>
<tbody>
{#each values as value}
<tr>
<td>{value}</td>
</tr>
{/each}
</tbody>
</table>

这些是我的包中的运行时 deps.json

"dependencies": {
"datatables.net": "^1.10.20",
"datatables.net-dt": "^1.10.20",
"jquery": "^3.4.1",
"sirv-cli": "^0.4.4"
}

jQuery工作正常，DataTable也工作正常，但我不知道如何告诉汇总包含DataTable css文件(在node_modules/datatables.net-dt/css中(

Answer 1

你可以直接导入 css 文件并使用 rollup-plugin-postcss：

<script>
import { onMount } from 'svelte'
import jQuery from 'jquery'
import 'datatables.net-dt/css'
// ...
</script>