目的

タイトルのエラーを解決した話をまとめる

実施環境

ハードウェア環境
| 項目 | 情報 |
| --- | --- |
| OS | macOS Catalina(10.15.3) |
| ハードウェア | MacBook Pro (16-inch ,2019) |
| プロセッサ | 2.6 GHz 6コアIntel Core i7 |
| メモリ | 16 GB 2667 MHz DDR4 |
| グラフィックス | AMD Radeon Pro 5300M 4 GB Intel UHD Graphics 630 1536 MB |
ソフトウェア環境

項目	情報	備考
PHP バージョン	7.4.3	Homwbrewを用いて導入
Laravel バージョン	7.0.8	commposerを用いて導入
MySQLバージョン	8.0.19 for osx10.13 on x86_64	Homwbrewを用いて導入

エラー内容

bladeのベースレイアウトファイルを使用したビューの表示で下記のエラーが発生した。
```
Cannot end a section without first starting one.
```

エラー原因

ベースレイアウトファイルでのsection宣言の終了部分に@endsectionを記載してしまっていた。

問題のコードを下記に記載する。

helloapp..blade.php

<!DOCTYPE html>
<html>
<head>
    <title>@yield('title')</title>
    <style>
        body{
            font-size: 16pt;
            color: #999;
            margin: 5px;
        }
        h1{
            font-size: 50pt;
            text-align: right;
            color: #f6f6f6;
        }
        ul{
            font-size: 12pt;
        }
        hr{
            margin: 25pt 100pt;
            border-top: 1px dashed #ddd;
        }
        .menutitle{
            font-size: 14pt;
            font-weight: bold;
            margin: 0px;
        }
        .content{
            margin: 10px;
        }
        .footer{
            text-align: right;
            font-size: 10pt;
            margin: 10px;
            border-bottom: solid 1px #ccc;
            color: #ccc;
        }
    </style>
</head>
<body>
    <h1>@yield('title')</h1>
    @section('menuber')
    <h2 class="menutitle">※メニュー</h2>
        <ul>
            <li>@show</li>
        </ul>
        <hr size="1">
        <div class="content">
            @yield('content')
        </div>
        <div class="footer">
            @yield('footer')
        </div>
    <!-- 下記が不要だった -->
    @endsection
</body>
</html>

解決方法

ベースレイアウトファイルの問題箇所を修正後エラーは解消された。
下記にベースレイアウトファイルの記載を行う。

helloapp.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>@yield('title')</title>
    <style>
        body{
            font-size: 16pt;
            color: #999;
            margin: 5px;
        }
        h1{
            font-size: 50pt;
            text-align: right;
            color: #f6f6f6;
        }
        ul{
            font-size: 12pt;
        }
        hr{
            margin: 25pt 100pt;
            border-top: 1px dashed #ddd;
        }
        .menutitle{
            font-size: 14pt;
            font-weight: bold;
            margin: 0px;
        }
        .content{
            margin: 10px;
        }
        .footer{
            text-align: right;
            font-size: 10pt;
            margin: 10px;
            border-bottom: solid 1px #ccc;
            color: #ccc;
        }
    </style>
</head>
<body>
    <h1>@yield('title')</h1>
    @section('menuber')
    <h2 class="menutitle">※メニュー</h2>
        <ul>
            <li>@show</li>
        </ul>
        <hr size="1">
        <div class="content">
            @yield('content')
        </div>
        <div class="footer">
            @yield('footer')
        </div>
    @endsection
</body>
</html>

下記にベースレイアウトを呼び出しているビューファイルの内容を記載する。

index.blade.php

@extends('layouts.helloapp')

@section('title', 'Index')

@section('menuber')
    @parent
    インデックスページ
@endsection

@section('content')
    <p>ここが本文のコンテンツです。</p>
    <p>必要なだけ記述できます。</p>
@endsection

@section('footer')
    copyright 2020 miriwo.
@endsection