我正在尝试将具有新功能的Font Awesome添加到具有惯性的Laravel 8 Jetstream中,但是会收到以下错误消息
I'm trying to add Font Awesome to newly installed Laravel 8 Jetstream with Inertia but receiving the following error
来自PostCSS插件的未知错误.您当前的PostCSS版本是8.2.4,但是postcss-import使用7.0.35.也许这是以下错误的根源.
错误:无法找到〜@ fortawesome/fontawesome-free/scss/brands"
Error: Failed to find '~@fortawesome/fontawesome-free/scss/brands'
App.css
@import 'tailwindcss/base'; @import 'tailwindcss/components'; @import 'tailwindcss/utilities'; @import '~@fortawesome/fontawesome-free/scss/brands'; @import '~@fortawesome/fontawesome-free/scss/regular'; @import '~@fortawesome/fontawesome-free/scss/solid'; @import '~@fortawesome/fontawesome-free/scss/fontawesome';Webpack.mix
mix.js('resources/js/app.js', 'public/js').vue() .postCss('resources/css/app.css', 'public/css', [ require('postcss-import'), require('tailwindcss'), require('autoprefixer'), ]) .webpackConfig(require('./webpack.config')); if (mix.inProduction()) { mix.version(); }Webpack配置
const path = require('path'); module.exports = { resolve: { alias: { '@': path.resolve('resources/js'), }, }, }; 推荐答案
首先,设置webpack.mix.js如下:
First, set up webpack.mix.js as follows: 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:
2.- Go ahead and install fontawesome:
npm install --save @fortawesome/fontawesome-free3.-创建一个新文件" resources/sass/app.scss "并包括以下内容:
3.- Create a new file "resources/sass/app.scss" and include the following:
@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.-执行以下命令:
4.- Execute the following commands:
npm install && npm run dev再来一次
npm run dev.
更多推荐
在Laravel 8中使用Tailwind安装Font Awesome
发布评论