Laravel 9仍然无法找到App.css和App.js，即使运行了npm run dev

Question

对 Laravel 相当陌生，我确保在潜水之前我确实查看了 Laravel 9 的文档，但万一我错过了一个，我会遇到这个问题，即在 artisan 提供的链接上找不到 app.css 和 app.js 。 Boostrap 脚手架现在位于视图文件夹中，但似乎（对此非常不确定）app.js 和 app.css 仍然无法访问，因此 bootstrap 不起作用。我确保在从 artisan 安装 bootstrap 和 boostrap --auth 之后运行 npm install 和 npm run dev 。截至目前，该项目是全新的，因此它可以工作，只是由于 404 错误，boostrap 无法加载。以下是项目的一些快照，包括正在运行的终端会话。

按顺序使用的命令：

1. composer 需要 laravel/ui --dev
2. php artisan ui bootstrap
3. php artisan ui boostrap --auth
4. npm install
5. npm 运行 dev

我在这里查看的所有线程都表明它们没有运行我已经在运行的 npm dev，但我仍然没有找到有效的解决方案。

Answer 1

您可以按照以下步骤操作：

使用 laravel 创建项目

composer create-project laravel/laravel "project name"

为 Bootstrap 5 安装 Laravel UI

composer require laravel/ui

使用bootstrap 5生成登录/注册脚手架

php artisan ui bootstrap --auth

在vite.config.js中导入bootstrap 5路径

import path from 'path';

resolve:{
       alias:{
           '~bootstrap': path.resolve(__dirname, 'node_modules/bootstrap'),
       }
   }

在js文件夹中导入bootstrap 5 scss

import '../sass/app.scss';

 import * as bootstrap from 'bootstrap';

在模板中使用@vite Blade指令

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

最终构建您的资产文件。

npm run build

然后使用 artisan 命令运行项目。

php artisan serve