Laravel CSS 资产函数没有指向正确的 URL答案

【问题标题】：Laravel CSS asset function doesn't point to correct URLLaravel CSS 资产函数没有指向正确的 URL
【发布时间】：2021-11-03 04:12:59
【问题描述】：

我正在使用 Laravel，在我的布局刀片模板文件（我的所有视图都使用）中，我有以下代码来生成我的样式表 URL：

<link href="{{ asset('css/app.css') }}" rel="stylesheet">

当页面生成时，如下所示：http://myapp.test/css/app.css 看起来是正确的，我在以下目录中有一个文件 \resources\css\app.css。

当我尝试通过 URL 直接访问 css 文件时，laravel 抛出 404 错误，有人能告诉我我做错了什么吗？

【问题讨论】：

如果您使用mix.css 或mix.sass 或类似的东西，但使用mix 创建它，那么在刀片中也使用mix。
resources/ 用于原始的、未编译的 JS/CSS。 Mix 和 webpack 等编译它们并在public/ 中生成输出。如果你不使用 webpack，只需将文件放入 public/。

【解决方案1】：

如果您没有使用 mix.css 或 tailwind 或其他任何东西，并且正在编写自己的 css，请将其放入 /public/css/app.css

【讨论】：

【解决方案2】：

当你使用 {{ asset('css/app.css') }} 时，laravel 指向 public/app.css。

浏览器只能访问公用文件夹内的内容。

Laravel 使用 webpack 编译位于 resources/css 中的 css 文件并保存到 public/css。

如果您查看位于项目根文件夹中的webpack.mix.js，您会看到以下内容：

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

因此，如果您访问 http://myapp.test/css/app.css ，您应该会在您的公共文件夹中找到 css。您可以通过浏览器开发者工具（即页面检查）的source 选项卡确认这一点。

【讨论】：