laravel-mix статический сайт font-awesome и значки начальной загрузки не отображаются?

Question

У меня есть некоторые проблемы, когда я использую laravel-mix для компиляции файлов scss в CSS, font-awesome и bootstrap-icons и другие библиотеки, которые содержат веб-шрифты, которые не отображаются, даже если они установлены правильно ??

файловая структура моих проектов:

      my-app/
├── dist/
│   ├── assets/
│   │   ├── css/
│   │   │    ├── app.css
│   ├── fonts/
│   │   ├── vendor/
│   │   │    ├── @fortawesome/
│   │   │    ├── bootstrap-icons/
│   ├── images/
├── src/
│   ├── scss/
│   │   ├── app.scss
│── index.html
│── package.json
└── webpack.mix.js

мой файл src / scss / app.scss:

      @import "~bootstrap-icons/font/bootstrap-icons";

$fa-font-path: "~@fortawesome/fontawesome-free/webfonts";

@import "~@fortawesome/fontawesome-free/scss/fontawesome";
@import "~@fortawesome/fontawesome-free/scss/solid";
@import "~@fortawesome/fontawesome-free/scss/brands";
@import "~@fortawesome/fontawesome-free/scss/regular";

Сообщение об ошибке консоли разработчика: