在 Laravel 專案使用 Tailwind CSS 和 Font Awesome

要在 Laravel 的專案中使用 Tailwind CSS 和 Font Awesome 的方法如下：

1. 修改 webpack.mix.js 如下：

mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css', [

     require('postcss-import'),
     require('tailwindcss'),
     require('autoprefixer'),
 ])
.sass('resources/sass/app.scss', 'public/css');
if (mix.inProduction()) {
    mix.version();
}

2. 安裝 fontawesome

npm install --save @fortawesome/fontawesome-free

3. 新增檔案 resources/sass/app.scss 並讀入 fontawsome

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

4. 執行 npm run watch/dev/prod

如果路徑沒有錯應該就能夠順利使用了。

參考：
Installing Font Awesome with Tailwind in Laravel 8