没有样式加载的 Svelte 库答案

【问题标题】：Svelte libraries loaded without style没有样式加载的 Svelte 库
【发布时间】：2021-06-04 21:13:59
【问题描述】：

我尝试将“Materialify”和“Carbon Components for Svelte”库连接到Sapper 项目。但事实证明，组件已加载，但没有样式。可能是什么问题呢？代码如下所示，使用官方网站上列出的命令安装。在 Ubuntu 20 上工作

<script>
    import {DataTable} from 'carbon-components-svelte'
</script>

<svelte:head>
    <title>Sapper project template</title>
</svelte:head>

<DataTable
    headers={[
            {key: 'name', value: 'Name'},
            {key: 'age', value: 'age'}
    ]}
    rows={[
            {id: 0, name: 'Stepan', age: 14},
            {id: 1, name: 'Maxim', age: 24}
    ]}
/>

结果： Compiled result

【问题讨论】：

您是否使用了“使用/脚手架”部分 (github.com/IBM/carbon-components-svelte#usage) 中提到的模板之一，并确保它是适合您用例的模板？
谢谢）我不是很专心，所以我没有看到这个）我不是在GitHub上看连接，而是在图书馆网站上（carbon-svelte.vercel.app）

标签： css user-interface svelte sapper

【解决方案1】：

感谢Thomas Hennes的回答。

为了使样式生效，您需要根据此库的 GitHub 存储库中的说明连接它们。 Sapper的解决方法：在_layout.svelte(routes)文件的script标签中，添加：

import 'carbon-components-svelte/css/[here styles file].css'

【讨论】：