Blade - @Extends não funciona | Laravel: facilitando o desenvolvimento PHP

Estou testando de acordo com as aulas e parece que não renderiza o código com blade, vou colocar meus códigos:

principal.blade.php
<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="/css/app.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Controle de Estoque</title>
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
</head>
<body>
    @yield('conteudo')

</body>
</html>

Listagem.php

@extends('principal')

@section('conteudo')
    <table class="table">
        <tr>
            <th>Id Produto</th>
            <th>Descrição</th>
            <th>Valor</th>
            <th>Quantidade</th>
            <th>Ver mais</th>
        </tr>
        <?php  foreach($produtos as $p): ?>
        <tr>
            <td><?= $p->id ?></td>
            <td><?= $p->descricao ?></td>
            <?php 
                $valor = $p->valor;
                $valor = number_format($valor, 2, ',','.');
            ?>
            <td>R$ <?= $valor ?></td>
            <td><?= $p->quantidade ?></td>
            <td><a href="mostrar/<?= $p->id ?>"><i class="fas fa-plus-circle btn btn-primary"></i></td>

        </tr>
        <?php endforeach ?>
    </table>
@endsection

A saída está no navegador esta sendo @extends('principal') @section('conteudo') Id Produto Descrição Valor Quantidade Ver mais 1 Geladeira R$ 1.000,00 32 TV 42 R$ 1.500,00 2@endsection

Alguma sugestão?