livewire Quickstart doesnt works

I am trying to perform the Livewire Quickstart. I have installed everything correctly and copied the code as it appears in the example and the dynamic behavior does not work for me. That is, I do not know whether or not it loads the Javascript because nothing appears in the console.

The html:


    @livewireStyles
        </head>
    
        <body>
    
    <livewire:counter/>
    
    @livewireScripts      
        </body>
    </html>

The class:

 class Counter extends Component
    {
        // cual propiedad puede accederse por el componente..
        public $count=0;
    
        public function increment()
        {
    
            $this->count++;
        }
    
        public function render()
        {
            return view('livewire.counter');
        }
    
      
    }

The button:

<div class="inline-block mr-2 mt-2">
                    {{-- wire: evento que se espera... ='metodo al que llama' --}}
                   <button wire:click="increment" type="button" class="focus:outline-none text-white text-sm py-2.5 px-5 rounded-md bg-green-500 hover:bg-green-600 hover:shadow-lg">Aumentar</button>
</div>

It does not work for me with the php artisan serve or with the virtual server that I have created that I also transcribe in case the path is wrong:

<VirtualHost *> DocumentRoot "C:\xampp\htdocs\cursos\public" ServerName cursos.test <Directory "C:\xampp\htdocs\cursos\public "> Options All AllowOverride All Require all granted

Thanks

Solution

In the Blade file of counter wrap it up into a single div element

<div>
<button wire:click="increment" type="button" class="focus:outline-none text-white text-sm py-2.5 px-5 rounded-md bg-green-500 hover:bg-green-600 hover:shadow-lg">Aumentar</button>
</div>

In the Counter component initialize count variable to 0

public $count = 0