How to fix ckeditor error after php artisan make:auth

Question

I am working on a Laravel project using ckeditor. All was working fine with the editor and no errors in the console until I ran:

php artisan make:auth

The project login/register then worked but the editor was not displaying with the error in the console:

Uncaught TypeError: a.ui.space(...) is null

I tracked it down to the line added to the app.blade.php file during the auth build:

<script src="{{ asset('js/app.js') }}" defer></script>

If I remove defer the editor comes back but I now get the console error:

[Vue warn]: Cannot find element: #app

I have seen quite a number of posts regarding the editor error but they not helping me get the root of the issue. Any ideas how to fix the error correctly?

Answer 1

I think the problem is that the script is executed before the DOM element is loaded in the DOM. Or you've placed it before the target element and then when the script calls, it cant find the element.

So you could place the script in a load event handler, something like this:

window.onload = function () {
  // your script here
}

---

window.addEventListener('load', function () {
  // your script here
}