I have installed Quilljs in my Laravel 9/Vite project and it runs fine on my local machine.
When I uploaded it to my server, I did the following:
And I have the following at the bottom of my blade file:
<script>
document.addEventListener("DOMContentLoaded", function(event) {
var toolbarOptions = [
[{ 'header': [1, 2, 3, false ]}],
['bold', 'italic', 'underline'],
[{ 'list': 'ordered'}, { 'list': 'bullet' }],
[{ 'color': [] }],
[{ 'align': [] }],
['clean']
];
var quill = new Quill('#quill_note', {
modules: {
syntax: false,
toolbar: toolbarOptions
},
theme: 'snow'
});
window.quill = quill
});
</script>
On my server I get "Uncaught ReferenceError: Quill is not defined", pointing to the row:
var quill = new Quill('#quill_note', {
This is the identical setup I have on my local build.
Any thoughts as to why I get this error even though I have successfully installed and imported Quill?
It turns out that Quill doesn't work when imported into the Vite js file when using "npm run build".
I removed it and added the CDN script line
<script src="https://cdn.quilljs.com/1.3.6/quill.js"></script>
instead in the head. Then it worked fine.