Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

devserge's avatar

Script not loading in Livewire child component

Hi there. I've been breaking my head all night over this and I just couldn't make it work or find any information. I have a manage.blade.php that, where I import a few livewire components.

It's looking like this:

    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            xxx
        </h2>
    </x-slot>

    <div class="py-12 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex gap-8">

        @include('nodes.sidebar')

        <!-- Main Content Area -->
        <div class="w-3/4 space-y-6">
            <livewire:nodes.node-info-cards lazy />
            <livewire:nodes.node-console lazy />
            <livewire:nodes.node-network />
        </div>
    </div>

</x-app-layout>

<script>
    console.log('Test');
</script>

node-network.blade.php

<div class="bg-white shadow rounded-lg p-6 mb-8">
    <!-- Header for the Network Data Section -->
    <div class="flex justify-between items-center mb-4">
        <h3 class="text-lg leading-6 font-medium text-gray-900">xxx</h3>
    </div>

    <div class="border-b pb-4 mb-4">
        <p class="text-sm text-gray-500">xxx</p>
        <div class="p-2 bg-gray-100 rounded-md mb-1 font-semibold">xxxx
    </div>

    <div class="mt-4">
        <canvas id="networkChart"></canvas>
    </div>
</div>

<script>
    console.log('Test'); // This script is not loading anywhere. Script is never loading in this component.
</script>

In this component, the script does load. But when I try to add a script in, for example node-network, it's not loading the script or even showing in my code. Why is that?

Really hope someone can help me out.

0 likes
1 reply
devserge's avatar

After 12 hours of looking to my code, I found the issue. It was because I used #[Lazy] in my component. Because of that, it didn't load the script.

How can I use lazy but also use a script?

Please or to participate in this conversation.