Tit*_*hos 6 font-awesome svelte sapper
我正在使用 Svelte/Sapper 编写服务器端渲染应用程序，但在使用 Font Awesome 字体时遇到问题。
我使用以下命令来加载字体：
<script>
import Icon from "svelte-awesome";
import { faTimes } from "@fortawesome/free-solid-svg-icons/faTimes";
</script>
<Icon data={faTimes} />
我看到的错误是：“不是有效的 SSR 组件。您可能需要检查构建配置以确保依赖项已编译，而不是作为预编译模块导入”
有针对这个的解决方法吗？
小智 8
经过 5 个小时的尝试，终于找到了在 Sveltekit 中使用 Fontawesome 图标的最简单方法（也适用于生产环境）：
安装 fontawesome 包
npm install @fortawesome/fontawesome-free
在您需要的组件或页面中导入包含所有图标的 css 文件。（也可以导入+layout.ts应用到多个页面）
npm install @fortawesome/fontawesome-free
您现在可以以简单经典的方式使用图标：
import '@fortawesome/fontawesome-free/css/all.min.css'
我希望这有帮助！
我来到这个页面，寻找将 FontAwesome CSS 导入到 Svelte 中而不需要任何其他组件或依赖项的方法。事实证明，使用 Svelte 这就像使用纯 HTML 一样简单：获取 FontAwesome CSS（例如通过包管理器、CDN 或下载）并将其添加到 HTML<head>部分。
我喜欢通过 npm 安装它，以维护其版本以及所有其他依赖项：
npm install --save @fortawesome/fontawesome-free
安装后，只需将样式表（来自node_modules内的@fortawesome目录）添加<head>到app.html.
<head>
...
<link href="./../node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet">
...
</head>
<i class="fa-regular fa-lightbulb">| 归档时间： |
|
| 查看次数： |
8857 次 |
| 最近记录： |