fa svelte

FA-SVELTE

Svelte v3.x的Fontawesome 5

（对于Svelte V2，使用FA-Svelte v1.xx）

关于

一个简单的简约轻巧的Svelte组件，用于字体很棒的SVG图标。

• 小足迹
• 仅二手图标会捆绑
• 没有依赖性
• 仅SVG（无字体）
• 不需要其他CSS文件

该库目前未打算充分展示该库，当大小和速度非常重要时，这是选择。

安装

作为开发依赖性安装

npm install -D fa-svelte

用法

基本用法

使用字体很棒的固体图标，首先使用NPM安装它们

npm install @fortawesome/free-solid-svg-icons

 < Icon icon = {icon} >
</ Icon >

< script >
import Icon from \'fa-svelte\'
import { faCircle } from \'@fortawesome/free-solid-svg-icons/faCircle\'

let icon = faCircle ;
</ script >

课程

 < div >
  < Icon class =\" myClass1 myClass2 \" icon = {faCircle} >
  </ Icon >
</ div >

< script >
import Icon from \'fa-svelte\'
import { faCircle } from \'@fortawesome/free-solid-svg-icons/faCircle\'

let icon = faCircle ;
</ script >
< style >

div : global (. myClass1 ) {
    color : red;
}

div : global (. myClass2 ) {
    font-size : 14 px ;
}
</ style > 

配置WebPack

如果您使用的是带有Svelte-Loader的WebPack，请确保将"svelte"添加到webpack配置中的resolve.mainFields 。这样可以确保WebPack导入未编译的组件（ src/Icon.svelte ），而不是编译版本（ index.js ） – 这更有效，并且还可以在运行时解决组件崩溃。

有关工作的Web包示例，请查看示例/webpack

学分

该组件基于Sveltejs提供的模板