1. 폰트어썸 설치

npm install --save-dev @fortawesome/fontawesome-free    


2. resources/sass/app.scss

$fa-font-path :"../webfonts";
 
//fontawesome
@import '~@fortawesome/fontawesome-free/scss/fontawesome.scss';
@import '~@fortawesome/fontawesome-free/scss/solid.scss';


3. 웹팩에 추가

const mix = require('laravel-mix');

mix.js('resources/js/app.js', 'public/js')
.sass('resources/sass/app.scss', 'public/css')
.postCss('resources/css/main.css', 'public/css', [
require('tailwindcss'),
])


4. 빌드하기

npm run dev

public/css/app.css 에 빌드된다.


5. main.blade.php 파일에 등록

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Movie App</title>

<!-- Tailwind Css Style -->
<link rel="stylesheet" href="/css/main.css">

<!-- Fomtatwesome -->
<link rel="stylesheet" href="/css/app.css">
</head>


사용방법

https://fontawesome.com/

'라라벨 > laravel-movies' 카테고리의 다른 글

테일윈드css 로딩 스피너 설치  (0) 2020.04.12
7. 디테일페이지 만들기  (0) 2020.04.06
4. main, index, show 디자인양식  (0) 2020.04.05
3. 구조잡기  (0) 2020.04.05
1. 라라벨7설치, 테일윈드css설치  (0) 2020.04.05

+ Recent posts