2.6. 基础布局

本教程最新版为 9.x,当前版本已放弃维护,请阅读最新版本!

基础布局

在教程开始之前,我们需要为我们的项目构建一个基础的页面布局,布局文件统一存放在 resources/views/layouts 文件夹中,布局涉及的文件如下:

  • app.blade.php —— 主要布局文件,项目的所有页面都将继承于此页面;
  • _header.blade.php —— 布局的头部区域文件,负责顶部导航栏区块;
  • _footer.blade.php —— 布局的尾部区域文件,负责底部导航区块;

主要布局文件

我们先创建主要布局文件:

resources/views/layouts/app.blade.php

<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <!-- CSRF Token -->
  <meta name="csrf-token" content="{{ csrf_token() }}">

  <title>@yield('title', 'LaraBBS') - Laravel 进阶教程</title>

  <!-- Styles -->
  <link href="{...

本文章首发在 LearnKu.com 网站上。

为了保证课程的高品质,我们需要对课程进行收费。付费后 才能观看剩余内容。 购买

上一篇 下一篇
《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
《L02 从零构建论坛系统》
以构建论坛项目 LaraBBS 为线索,展开对 Laravel 框架的全面学习。应用程序架构思路贴近 Laravel 框架的设计哲学。
贡献者:2
讨论数量: 74

lujiancai
关于 yarn install 报错的问题
7 个点赞 | 8 个回复 | 分享 | 课程版本 6.x
tooyond
建议大家在修改完样式以后使用 Ctrl+F5 进行强制刷新缓存
4 个点赞 | 8 个回复 | 分享 | 课程版本 5.5
sunny_whl
关于遇到 "node" is incompatible with this module 的分享
3 个点赞 | 7 个回复 | 分享 | 课程版本 8.x
Winter1
yarn install 安装报错的另一个解决方案
3 个点赞 | 0 个回复 | 分享 | 课程版本 5.5
ruodee
此处留下一个小小的提醒,检查了两个小时才发现
2 个点赞 | 5 个回复 | 分享 | 课程版本 5.5
poison
NPM run dev 之后 NPM install vue-template-compiler 报错
2 个点赞 | 3 个回复 | 分享 | 课程版本 5.8
Moonshadow2333
解决Windows环境下laravel mix 无法安装的问题
2 个点赞 | 2 个回复 | 分享 | 课程版本 8.x
懒惰的大叔
laravel8 使用 Yarn 安装依赖报错?该怎么解决呢?
1 个点赞 | 11 个回复 | 问答 | 课程版本 8.x
abing
为什么我的按上面做直接报 Call to undefined function route_class ()?
1 个点赞 | 10 个回复 | 问答 | 课程版本 5.5
zoezhao7
win10 环境下运行 Laravel Mix 出现错误?
1 个点赞 | 10 个回复 | 问答 | 课程版本 5.5
Damian
Laravel5.6 Bootstrap4.0 头部样式如何修改?
1 个点赞 | 5 个回复 | 问答 | 课程版本 5.5
zz52998
error /home/Vagrant/code/larabbs/node_modules/webpack-cli: Command failed.
1 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
静静的风
在 route_class 这个方法中?
1 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
sinmu
解决登录注册字体和LaraBBS字体样紧挨着
1 个点赞 | 1 个回复 | 分享 | 课程版本 8.x
Gxpro
@import "variables"这句话是什么意思呢?
1 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
HuiXi
运行完yarn指令后运行npm run watch-poll指令提示mix not found
0 个点赞 | 19 个回复 | 问答 | 课程版本 8.x
lara_min
node-Sass: Command failed 求大神帮忙解答看下,十分感谢!~?
0 个点赞 | 10 个回复 | 问答 | 课程版本 5.5
KevinJiao
yarn install 一直处于 waiting 状态,安装进行不下去?
0 个点赞 | 8 个回复 | 问答 | 课程版本 5.5
lianglunzhong
为什么我把 home.blade.php 文件都删了,首页还是这个页面?
0 个点赞 | 8 个回复 | 问答 | 课程版本 5.5
g1f9
NPM run watch 无法自动编译?
0 个点赞 | 8 个回复 | 问答 | 课程版本 5.5
JackZhang
依旧是 Laravel mix 问题?
0 个点赞 | 6 个回复 | 问答 | 课程版本 5.5
sachu
NPM run watch-poll 在终端运行的时候,怎么打入别的命令?
0 个点赞 | 6 个回复 | 问答 | 课程版本 5.5
xxr_yeah
请问前端 public/CSS/app.css 是怎么得来的
0 个点赞 | 5 个回复 | 问答 | 课程版本 5.5
JackZhang
yarn install --no-bin-links 一直在 waiting?
0 个点赞 | 5 个回复 | 问答 | 课程版本 5.5
nuker
按照文档的步骤来操作,app.scss 文件样式没有加载?
0 个点赞 | 4 个回复 | 问答 | 课程版本 5.8
Nella
tars_liang
NPM run watch-poll 报错
0 个点赞 | 3 个回复 | 问答 | 课程版本 5.8
TigerLin
Route::get ('/', 'PagesController@root')->name ('root')?
0 个点赞 | 3 个回复 | 问答 | 课程版本 5.5
surest
安装 yarn 一直等待中?
0 个点赞 | 3 个回复 | 问答 | 课程版本 5.5
liwei3773
安完 yarn,NPM run watch-poll 报错?
0 个点赞 | 3 个回复 | 问答 | 课程版本 5.5
liwei3773
按照教程做的,NPM run watch-poll 为什么报这个错呢?
0 个点赞 | 2 个回复 | 问答 | 课程版本 6.x
ayauper
模版文件存在,显示没找到!
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.8
PHPHub
yarn install 报错,
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.7
小宝爹
Laravel mix 运行报错
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
chentury
import 文件出错了?
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
无法使用 larabbs.app 访问 但可以 larabbs.test 访问
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
nhyzs
关于yarn报错以及watch-poll后mix报错的解决方案
0 个点赞 | 1 个回复 | 分享 | 课程版本 8.x
HNYWHS
win10 npm run watch-poll
0 个点赞 | 1 个回复 | 分享 | 课程版本 8.x
qingye
yarn install node 版本低 报错解决和安装 node 后报错解决
0 个点赞 | 1 个回复 | 分享 | 课程版本 6.x
olaf
CSS 的 body 属性是用页首的还是页脚的那边写的?
0 个点赞 | 1 个回复 | 问答 | 课程版本 6.x
jxdr
关于 复制后出像的问题,
0 个点赞 | 1 个回复 | 分享 | 课程版本 6.x
Cyline
Laravel Mix 编译前端资源出错,求指教
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
eeyes-backend
或许可以用 Laravel6 提供的 Str 类的方法替换 str_replace ()
0 个点赞 | 1 个回复 | 分享 | 课程版本 6.x
fakecoder
请问闪存,这里怎么设置?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.7
_杭城浪子
yarn 和 NPM 有啥区别
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
郎中航
知识点小结
0 个点赞 | 1 个回复 | 教程 | 课程版本 5.5
Oyxiaoxi
优化页首 ~Bootstrap-Sass 这个目录从何而来?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
船长在这儿
新版本要注意bs4到bs5的变化
0 个点赞 | 0 个回复 | 分享 | 课程版本 9.x
dapaoteshi
return view('pages.root') 错了
0 个点赞 | 0 个回复 | 分享 | 课程版本 6.x
vmarsed
npm run dev/watch-poll 的解决经验
0 个点赞 | 0 个回复 | 分享 | 课程版本 8.x
五之无建
[已解决]关于laravel8 yarn 安装 报错问题
0 个点赞 | 0 个回复 | 分享 | 课程版本 8.x
懒惰的大叔
homestead开发laravel8,除了首页其他全部提示404 not fount?
0 个点赞 | 0 个回复 | 问答 | 课程版本 8.x
mingzheng
yarn install安装失败
0 个点赞 | 0 个回复 | 问答 | 课程版本 7.x
JHWu
Laravel Mix 安装问题
0 个点赞 | 0 个回复 | 问答 | 课程版本 5.7
Cyline
关于 yarn install 的问题,别问我为啥?我也不知道为啥
0 个点赞 | 0 个回复 | 分享 | 课程版本 6.x
yxkj
读取 config 配置的多种方法
0 个点赞 | 0 个回复 | 分享 | 课程版本 6.x
7csn
安装 Laravel-MIX,依然还是 The Mix manifest does not exist
0 个点赞 | 0 个回复 | 问答 | 课程版本 6.x
college_lsxt
Cannot find module 'cross-spawn'解决方法参考
0 个点赞 | 0 个回复 | 分享 | 课程版本 5.8
tw0325795
shared 與 common 目錄之間的差別
0 个点赞 | 0 个回复 | 问答 | 课程版本 5.8
Winter1
yarn install 报错?
0 个点赞 | 0 个回复 | 问答 | 课程版本 5.7
任飘渺
Laravel MIX
0 个点赞 | 0 个回复 | 博客 | 课程版本 5.5
JackZhang
sudo yarn install --no-bin-links?依然报错
0 个点赞 | 0 个回复 | 问答 | 课程版本 5.5