alguem me ajuda pf é sobre a api

então eu tava querendo treinar javaScript orientado a objeto então eu fiz bem diferente do professor, mas na verdade eu não sei qual o meu erro eu passei já 4h tentando achar e não econtro. ele não aparece com a lista da API que eu peguei.

<script type="module" src="index.js"></script>

codigo do index.js. note que estou usando type="module" na tag script:

import { ClienteController } from './Cliente-Controlls.js';

const ClienteControlls = new ClienteController()

codigo do cliente-controlls.js

import { ListaClientes } from './Lista-Clientes.js';

export class ClienteController {
    constructor() {
        this._listaClientes = new ListaClientes();
        this.importarClientes()
        this.mostrarClientes()
    }

    importarClientes() {
        fetch('http://localhost:4000/clientes')
        .then(res => res.json())
        .then(cl => cl.forEach(cliente => this._listaClientes.add(cliente)))
    }

    mostrarClientes() {
        const tableBody = document.querySelector('#table__body');
        this._listaClientes.clientes.forEach(cliente => {
            const template = `
                <tr>
                    <td>${cliente.cpf}</td>
                    <td>${cliente.nome}</td>
                </tr>
            `;

            tableBody.innerHTML += template;
        })
    }
}

meu codigo no lista-cliente:

export class ListaClientes {
    constructor() {
        this._listaClientes = [];

    }

    get clientes() {
        return this._listaClientes;
    }

    add(cliente) {
        this._listaClientes.push(cliente);
    }
}