如果路由低一级，则不调用 Blade Parent CSS
Posted
技术标签:
【中文标题】如果路由低一级，则不调用 Blade Parent CSS【英文标题】：Blade Parent CSS not called if route is one level lower 【发布时间】：2020-07-30 12:31:06 【问题描述】：我正在为 Web 应用程序构建管理界面。
完整的目录结构如下：
|-main
| |- app
| |- bootstrap
| |- config
| |- database
| |- resources
| | -views
| |-admin
| |-templates
| |-template.blade.php
| |-utils
| |-foot.blade.php
| |-head.blade.php
| |-views
| |-index.blade.php
| |-users.blade.php
| |- routes
| |- web.php
|
|-public_html
| |-admindash
| |-dist
| |-css
| |-img
| |-js
| |-plugins
| |-bootstrap
| |-fontawesome-free
| |-jquery
head.blade 文件看起来与此类似：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>...</title>
<!-- Font Awesome Icons -->
<link rel="stylesheet" href="../admindash/plugins/fontawesome-free/css/all.min.css">
.
.
some more css here
.
.
</head>
<body class="hold-transition sidebar-mini">
脚刃：
<script src="../admindash/plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script
.
.
.
More scripts here
.
.
.
</body>
</html>
模板刀片然后包含这两个刀片并产生一个供子刀片填充的部分：
@include('admin.utils.head')
<div class="wrapper">
<!-- Main content -->
<div class="content">
@yield('maincontent')
</div>
<!-- /.content -->
</div>
@include('admin.utils.foot')
然后使用视图文件夹中的索引和用户刀片，我执行以下操作
@extends('admin.templates.template')
@section('maincontent')
.
.
main html goes here
.
.
@endsection
到目前为止一切正常，我定义了返回刀片文件的控制器函数和我定义的 web.php 路由：
//Admin Dashboard routes
Route::group(['namespace' => 'Admin'], function ()
Route::get('/admin/dashboard', 'DashboardController@adminHome')->name('AdminDashboard');
Route::get('/admin/maintenance/users', 'DashboardController@displayUsers')->name('AdminDashboardUsers');
);
当我加载路由 /admin/dashboard 时，样式呈现完美，没有错误。棘手的部分是当我渲染 /admin/maintenance/users 时，一切都消失了，我得到一个骨架 html 文件，控制台中出现错误，无法加载 css 资源。
注意：css 和 js 文件都位于项目文件夹之外的 public_html 文件夹中。
【问题讨论】：
因为您使用的是相对Url...请显示清晰的文件夹结构。 已经编辑添加完整的目录结构 所以你把public改名为public_html对吧？
不，该项目在共享主机上运行，因此我必须将引导模板文件放入 public_html（可公开访问）文件夹中，并将实际应用程序代码放入单独的文件夹中......所以主要和 public_html 在目录方面基本上处于同一级别
【参考方案1】：
问题是您使用的是相对 URL。您需要使用 完整 URL 而不是 Relative。而您正在接近 Wrong Way 在Shared Hosting中部署您的 laravel。
解决方案
只需输入所有css 和js 文件的完整网址，如下所示，
<link rel="stylesheet" href="http://www.yourdomain.com/admindash/plugins/fontawesome-free/css/all.min.css">
最佳实践（共享主机）
将 laravel public 目录更改为 public_html。 (Refer Here)
使用url() 或URL::assert() 函数生成断言/完整URL (Refer Here)
How to deploy Laravel Application in Shared Hosting?
【讨论】：
以上是关于如果路由低一级，则不调用 Blade Parent CSS的主要内容，如果未能解决你的问题，请参考以下文章
如何在 Javascript Laravel Blade 中编写路由 URL？
从 Angular2 路由中的子组件调用 router.parent.navigate 方法时未触发组件构造函数和路由器生命周期挂钩