Setting Summernote for Laravel Livewire

Summernote for Laravel Livewire

// HTML
<div class="col-md-12">
    <div class="form-group" wire:ignore>
        <label for="desciption">Deskripsi</label>
        <textarea type="text" input="description" id="summernote" class="form-control summernote">{{ $description }}</textarea>
    </div>
</div>


// JAVASCRIPT
$('.summernote').summernote({
      tabsize: 2,
      height: 200,
      toolbar: [
          ['style', ['style']],
          ['font', ['bold', 'underline', 'clear']],
          ['color', ['color']],
          ['para', ['ul', 'ol', 'paragraph']],
          ['table', ['table']],
          ['insert', ['link', 'picture', 'video']],
          ['view', ['fullscreen', 'codeview', 'help']]
      ],
      callbacks: {
          onChange: function(contents, $editable) {
          @this.set('description', contents);
      }
  }
  });

From my experience, I use alpine js for performance optimization.