font-awesome 등에 익숙해 버리면, Voyager에서 준비되어 있는 200 정도의 아이콘으로는 부족한 몸으로 되어 버립니다.

다행히 Voyager에는 additional_css 와 additional_js 라고 하는 설정치가 존재하므로, 여기에 font-awesome를 넣어 갑시다.

준비

font-awesome 설치

$ npm i @fortawesome/fontawesome-free --save-dev

laravel Mix에서 font-awesome.css 만들기

resources\sass\font-awesome.scss

// Font Awesome
@import '~@fortawesome/fontawesome-free/scss/fontawesome';
@import '~@fortawesome/fontawesome-free/scss/solid';
@import '~@fortawesome/fontawesome-free/scss/regular';
@import '~@fortawesome/fontawesome-free/scss/brands';

webpack.mix.js

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .sass('resources/sass/font-awesome.scss', 'public/css');

$ npm run dev

참고 : htps : // 코 m/아리_또한/있어 ms/5d2 베후아 8f367050아아

만든 font-awesome.css를 Voyager로 가져옵니다.

config\voyager.php

    'additional_css' => [
        'css/font-awesome.css',
    ],

설정

준비가 되면 font-awesome 을 사용할 수 있게 됩니다.

BREAD의 '아이콘'란에 font-awesome의 클래스명을 기술하면 OK입니다.






font-awesome 아이콘을 볼 수 있습니다.






물론 사이드 메뉴 아이콘도 (메뉴 빌더로 설정)






이 거리.

보충

만약 Alias ​​잘라
서브디렉토리에서 움직이는 프로젝트의 경우,
font-awesome.css가 글꼴 파일을 찾을 수 없습니다.
아이콘이 두부가되어 버립니다.

그런 경우에는
이 기사 참고.