Laravel weird texts in my view files.

@Tray2 sry i wasn't abled to upload code and images/links for some strange glitch

<div>
            |---LINE:53---|<x-secondary-button class="ml-auto !px-2" type="button" |---LINE:53---|@click="$dispatch('show-page-spinner')"
                wire:click='open_modal'>
                <svg class="size-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
                    stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
                </svg> Create
            </x-secondary-button>
 
            |---LINE:61---|<x-modal name="template-form-modal">

i have to run php artisan view:clear every time and the hot reload keeps refreshing the page continuously .

It's so annoying . I'm using tailwind CSS , I don't know if there's some problem with tailwind itself

@joydeep That is by design to make it a little harder for spammers. New accounts are not allowed to add links to their posts.

What does the class look like?

@Tray2

this is happening for every page that has any livewire component in it

<?php
#on progress
use function Livewire\Volt\{state, mount};

state(['id' => 'unique-' . uniqid(), 'files' => null, 'multiple' => false]);

mount(function ($files = [], $multiple = false, $delete_fn = '') {
    $this->files = $files;

    $this->multiple = $multiple;

    $this->delete_fn = $delete_fn;
});

?>
<div class="group relative flex cursor-pointer flex-wrap gap-2 rounded-md border border-dashed p-2"
    for="{{ $id }}" x-data="{
        files: [],
        handleChange(event) {
            const selectedFiles = Array.from(event.target.files);
            selectedFiles.forEach(file => {
                const reader = new FileReader();
                reader.onload = (e) => {
                    this.files.push({
                        file: file,
                        type: file.type,
                        url: file.type.startsWith('image') ? e.target.result : null,
                    });
                };
                reader.readAsDataURL(file);
            });
            console.log(this.files)
        },
        removeFile(index) {
            this.files.splice(index, 1);
            fileinput.dispatch(new Event('input'));
        }
    }" wire:loading.class='disabled'>
    <label class="size-24 grid place-items-center rounded border border-dashed" for="{{ $id }}">

        <svg class="size-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
            stroke="currentColor">
            <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
        </svg>
        <input class="hidden" id="{{ $id }}" type="file" x-ref="fileinput" @change='handleChange'
            {{ $multiple ? 'multiple' : '' }}>
    </label>

    <template x-for="(file,index) in files">

        <div class="size-24 relative grid place-items-center overflow-hidden rounded border border-dashed">

            <button class="absolute right-1 top-1 hidden rounded-full border bg-black p-2 text-white group-hover:block"
                type="button" @click='removeFile(index)'>
                <svg class="size-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
                    stroke-width="1.5" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round"
                        d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
                </svg>
            </button>
            <template x-if="file.type.startsWith('image')">
                <img class="w-full object-contain" :src="file.url">
            </template>
            <template x-if="!file.type.startsWith('image')">
                <svg class="size-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
                    <path
                        d="M9 2.00318V2H19.9978C20.5513 2 21 2.45531 21 2.9918V21.0082C21 21.556 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5501 3 20.9932V8L9 2.00318ZM5.82918 8H9V4.83086L5.82918 8ZM11 4V9C11 9.55228 10.5523 10 10 10H5V20H19V4H11Z">
                    </path>
                </svg>
            </template>

        </div>
    </template>
    
    @foreach ($files as $file)
        <div class="size-24 relative grid place-items-center overflow-hidden rounded border border-dashed">

            <button class="absolute right-1 top-1 hidden rounded-full border bg-black p-2 text-white group-hover:block"
                type="button" @click='removeFile(index)'>
                <svg class="size-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"
                    stroke-width="1.5" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round"
                        d="m14.74 9-.346 9m-4.788 0L9.26 9m9.968-3.21c.342.052.682.107 1.022.166m-1.022-.165L18.16 19.673a2.25 2.25 0 0 1-2.244 2.077H8.084a2.25 2.25 0 0 1-2.244-2.077L4.772 5.79m14.456 0a48.108 48.108 0 0 0-3.478-.397m-12 .562c.34-.059.68-.114 1.022-.165m0 0a48.11 48.11 0 0 1 3.478-.397m7.5 0v-.916c0-1.18-.91-2.164-2.09-2.201a51.964 51.964 0 0 0-3.32 0c-1.18.037-2.09 1.022-2.09 2.201v.916m7.5 0a48.667 48.667 0 0 0-7.5 0" />
                </svg>
            </button>
            @if (str_starts_with($file->mime_type, 'image'))
                <img class="w-full object-contain" :src="file.url">
            @else
                <a href="{{ $file->getUrl() }}" download="true">
                    <svg class="size-6" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
                        <path
                            d="M9 2.00318V2H19.9978C20.5513 2 21 2.45531 21 2.9918V21.0082C21 21.556 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5501 3 20.9932V8L9 2.00318ZM5.82918 8H9V4.83086L5.82918 8ZM11 4V9C11 9.55228 10.5523 10 10 10H5V20H19V4H11Z">
                        </path>
                    </svg>
                </a>
            @endif

        </div>
    @endforeach
</div> 

@joydeep Looks like you read the files that are stored in a directory, so my guess is that you read the directory containing those files. You also most likely har turned on caching somewhere, I suggest turning that of in dev.

@Tray2 the problem is not specifically related to this component and I have not modified any caching behavior

:(

I don't know what to do now

@joydeep do you see the same if you just run an artisan command?