在 Laravel 8 中使用堆栈
Posted
技术标签:
【中文标题】在 Laravel 8 中使用堆栈【英文标题】:Using stacks in Laravel 8 【发布时间】:2021-05-29 08:38:20 【问题描述】:我正在使用 Laravel 8 和 Jetstream 构建一个站点。 Jetstream 对 javascript / css 框架持固执己见,这很棒,但我需要将外部 javascript 库添加到我的一个组件中,而且我看不到任何地方可以将它们添加到默认的 app
布局中。所以我在默认的应用布局中为 css /js 添加了一个堆栈:
<!DOCTYPE html>
<html lang=" str_replace('_', '-', app()->getLocale()) ">
<head>
// head stuff
<title> config('app.name', 'Laravel') </title>
<!-- Styles -->
<link rel="stylesheet" href=" mix('css/app.css') ">
@livewireStyles
@stack('css') // added this stack
<!-- Scripts -->
<script src=" mix('js/app.js') " defer></script>
</head>
<body class="font-sans antialiased">
// body stuff
</body>
@stack('scripts') // and this stack
</html>
然后在我扩展应用布局的子视图中,我试图将 js 文件推送到 js 堆栈:
<x-app-layout>
<x-slot name="header">
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
__('Stuff & Things')
</h2>
</x-slot>
<div class="py-12">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg">
<x-component.stuffnthings />
</div>
</div>
</div>
</x-app-layout>
@push('scripts')
<script src=public_path("js/mobiscroll.javascript.min.js")></script>
@endpush
当我查看源代码时,js 文件不在子视图中。我错过了什么?这是将自定义 js / css 添加到 Jetstream 的正确方法还是有更好的方法?
【问题讨论】:
【参考方案1】:对于任何将头撞在类似墙上的人——我的代码的问题是push
需要在布局标签内。一旦我向上移动它,它就起作用了(而且我一直使用 public_path
错误):
<x-app-layout>
<x-slot name="header">
<h2 class="font-semibold text-xl text-gray-800 leading-tight">
__('Stuff & Things')
</h2>
</x-slot>
<div class="py-12">
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
<div class="bg-white overflow-hidden shadow-xl sm:rounded-lg">
<x-component.stuffnthings />
</div>
</div>
</div>
@push('scripts')
<script src="js/mobiscroll.javascript.min.js"></script>
@endpush
</x-app-layout>
如果有更好的方法来完成此操作,我将保持打开状态!
【讨论】:
以上是关于在 Laravel 8 中使用堆栈的主要内容,如果未能解决你的问题,请参考以下文章
在 App::abort(403) 之后抑制 Laravel 日志中的堆栈跟踪转储
使用 Laravel Vue Inertia 堆栈中的数据重定向路由
Laravel:是不是可以在捕获异常时记录堆栈跟踪并继续执行?
Laravel - 在 LAMP 堆栈上将 /public 设置为 root