Error: Cannot read property 'getAttribute' of null (ckeditor)

user_11464924 0
Viewed 3005

I am making Laravel CMS with ckeditor. When I write some html code in ckeditor source code mode status, I got some error as follows;

Uncaught TypeError: Cannot read property 'getAttribute' of null
    at Widget.init (plugin.js?t=H0CG:366)
    at new Widget (plugin.js?t=H0CG:967)
    at Repository.initOn (plugin.js?t=H0CG:498)
    at Repository.initOnAll (plugin.js?t=H0CG:535)
    at a.<anonymous> (plugin.js?t=H0CG:2816)
    at a.p (ckeditor.js:10)
    at a.<anonymous> (ckeditor.js:12)
    at a.CKEDITOR.editor.CKEDITOR.editor.fire (ckeditor.js:13)
    at ckeditor.js:877

And the status of source code editing is unenabled.
This page has somewhat much contents including about 200 ~ 250 words and 15 images.
In my thought, are there some limitation of ckeditor contents?

ckeditor4.x ckeditor5 laravel ckeditor javascript
1 Answers

I had same error After so many attempts this helped me fix the problem

just needed the webpack rule like this:

const filesRuleIndex = cfg.module.rules.findIndex(item => {
  return item.test.test('.svg')
})

if (filesRuleIndex !== -1) {
  cfg.module.rules[filesRuleIndex].test = /\.(png|jpe?g|gif|webp)$/
  const svgRule = {...cfg.module.rules[filesRuleIndex]}
  svgRule.test = /\.svg/
  svgRule.exclude = svgRule.exclude || []
  svgRule.exclude.push(path.join(__dirname, 'node_modules', '@ckeditor'))
  cfg.module.rules.push(svgRule)
}

cfg.module.rules.push({
  test: /ckeditor5-[^/\\]+[/\\]theme[/\\]icons[/\\][^/\\]+\.svg$/,
  use: ["raw-loader"]
})
user_122844370
Related