Upload images with Livewire and compress with Intervention Image.

Livewire Intervention Image File Upload

//HTML
<div class="avatar-file">
  <label class = "text-bh-navy-500">Choose Image</label>
  <input type = "file" wire:model = "avatar">
</div>

//LW Component
    use WithFileUploads;

    public $avatar;

    public function submitProfileUpdate() {
        $data = $this->validate([
            'first_name' => 'required',
            'last_name' => 'required',
            'avatar' => 'nullable|image|max:2048', // 2MB Max
        ]);

        $image = $this->avatar;
        $avatarName = $this->first_name . '-' . $this->last_name . '-' . substr(uniqid(rand(), true), 8, 8) . '.' . $image->getClientOriginalExtension();
        $img = Image::make($image->getRealPath())->encode('jpg', 65)->fit(760, null, function ($c) {
            $c->aspectRatio();
            $c->upsize();
        });
        $img->stream(); // <-- Key point
        Storage::disk('local')->put('public/images/avatars' . '/' . $avatarName, $img, 'public');

        //SAVE FILE NAME TO DB
        $userUpdate = Auth::user()->update([
            'first_name' => $this->first_name,
            'last_name' => $this->last_name,
            'avatar' => $avatarName,
        ]);