Laravel 9是否支持Bootstrap 5图标？图标无法显示求助

Laravel 9 完全支持 Bootstrap 5 图标，你的项目依赖配置没问题，图标不显示是导入路径和使用细节导致的，按以下步骤修复：

• 修正CSS导入路径
  Vite 不支持 ~ 作为包路径别名，需要修改导入语句：

  • 在 resources/js/app.js 中，将：

    import '~bootstrap-icons/font/bootstrap-icons.css'
    

    改为：

    import 'bootstrap-icons/font/bootstrap-icons.css'
    

  • 在 resources/sass/app.scss 中，将：

    @import '~bootstrap-icons/font/bootstrap-icons.css';
    

    改为：

    @import 'bootstrap-icons/font/bootstrap-icons.css';
    

  注意：不要同时在JS和SCSS文件中重复导入图标CSS，选择其中一个即可，避免资源冗余。

• 修复HTML标签闭合问题
  你的图标标签未闭合，浏览器解析会出现异常，修改为：

  <i class="fs-4 bi-speedometer2"></i>
  <i class="fs-4 bi-house"></i>
  

• 重新编译前端资源
  执行Vite的编译命令更新资源：

  # 开发环境
  npm run dev
  
  # 生产环境
  npm run build
  

• 确认视图资源引入
  确保Blade视图中正确引入编译后的资源：

  @vite(['resources/js/app.js', 'resources/sass/app.scss'])
  

内容的提问来源于stack exchange，提问作者Ganesh Adhikari