behnampmdg3's avatar

Issue with CKeditor

Hi;

I usually use npm to add js packages.

This time I decided to add something manually.

The candidate is https://artisansweb.net/install-use-ckeditor-laravel/

Everything seems to be ok however, I get these errors:

https://ibb.co/Btf1x2r

Obviously can't load the CKeditor resources.

Here is the app.js file:

require('./bootstrap');
require('../../vendor/unisharp/laravel-ckeditor/ckeditor.js');


$(document).ready(function() {
  //Load CKeditor
  CKEDITOR.replace( 'body' );

  //Code highlighter
  $('pre code').each(function(i, block) {
    hljs.highlightBlock(block);
  });

  
});

window.Vue = require('vue');

import hljs from 'highlight.js';
import 'highlight.js/styles/github.css'

window.hljs = hljs;

And this is my directory structure

https://ibb.co/ydDkb4D

What am I doing wrong?

Thanks

0 likes
1 reply
nagavinod424's avatar

@behnampmdg3 the path of script file is wrong..... if you want to merge the file in app.js then cut the folder from public folder and paste it in assets folder then remove the "../../vendor/" from the path

or else u can directly use the ckeditor before loading the app.js from the public folder itself using

<script src="{{ asset('vendor/unisharp/laravel-ckeditor/ckeditor.js') }}"></script>
<script>
    CKEDITOR.replace( 'body' );
</script>
 

i recommend relative paths while referencing the js and css files

Please or to participate in this conversation.