---
# System prepended metadata

title: 在Rails專案安裝 font awesome
tags: [ruby, rails]

---

# 在Rails專案安裝 font awesome

###### tags: `rails`, `ruby`
環境:
> ruby 2.6.7
> 
> Rails 6.1.3.1
> 
> Ubuntu 20.04 LTS
> 
> gem_webpacker

## :memo:

### Step 1: 使用 yarn 安裝 vueJS

```ruby=
# 終端機ubuntu
$ yarn add @fortawesome/fontawesome-free
```
:::info
:bulb: **Hint:** 此時會在

1.路徑: **app_name/node_modules/@fortawesome** 生成相關檔案
### Step 2: 移至webpacker/packs目錄下import vueJS

```ruby=
# 路徑 app_name/app/javascript/packs/application.js
import "@fortawesome/fontawesome-free/css/all.min.css"
```

### Step 3: 測試

```ruby=
# edit.html.erb
<i class="far fas fa-user"></i>
```