Best way to include css in livewire view?

#1

What is the best way to include a css file (maybe sass compiled by webpack) inside a livewire view? Currently I’m doing this in my livewire blade view:

@push('styles')
    {!! css('signup.css') !!}
@endpush

<div>
.... here is my livewire blade code
</div>

Above snippet uses a custom function I wrote:

if (!function_exists(‘css’)) {
function css($relativePath) {
return ‘<link href="’ . asset(“css/”.$relativePath) . ‘" rel=“stylesheet”>’;
}
}

Is there a better way to do this?

#2

Hey @ilianandreev,

when you want to use component specific CSS, this is the was to go (at least for me).
I personally would wrap the push directive within “@once” in order to avoid the stylesheet duplication when using the component more than once on the same page.