Ledzz / angular2-tinymce

Angular 2 component for TinyMCE MCE WYSIWYG editor
https://angular2-tinymce.surge.sh
66 stars 37 forks source link

Cannot read property 'nodeName' of null during init #10

Closed djleonskennedy closed 7 years ago

djleonskennedy commented 7 years ago

EXCEPTION: Uncaught (in promise): TypeError: Cannot read property 'nodeName' of null TypeError: Cannot read property 'nodeName' of null

without plugins all works fine

config:

export const TINYMCE_CONFIG: any = {
  skin_url: 'node_modules/tinymce/skins/lightgray',
  baseURL: 'node_modules/tinymce',
  plugins: [
    'advlist autolink lists link charmap print preview anchor',
    'searchreplace visualblocks code fullscreen',
    'insertdatetime media table paste'
  ],
  browser_spellcheck: true,
  contextmenu: false
};

image

szavoda commented 7 years ago

Hi - can you clarify how you solved this issue? I saw you mentioned loading the plugins globally, but how was that accomplished?

Romgua commented 7 years ago

I have the exactly same error. Can you explain how you resolved this please ?

szavoda commented 7 years ago

It has been a while since I fixed this for myself, but I think that just importing the individual plugins in app.module (or a shared module in my case) worked for me:

import 'assets/tinymce/plugins/fullscreen/plugin.js'; import 'assets/tinymce/plugins/image/plugin.js'; import 'assets/tinymce/plugins/media/plugin.js'; import 'assets/tinymce/plugins/hr/plugin.js'; import 'assets/tinymce/plugins/insertdatetime/plugin.js'; import 'assets/tinymce/plugins/preview/plugin.js'; import 'assets/tinymce/plugins/print/plugin.js'; import 'assets/tinymce/plugins/textcolor/plugin.js'; import 'assets/tinymce/plugins/colorpicker/plugin.js'; import 'assets/tinymce/plugins/emoticons/plugin.js'; import 'assets/tinymce/plugins/charmap/plugin.js';

This is just before the @NgModule Declarations, Imports, etc.

Romgua commented 7 years ago

Oh ok, thank you !

syiwa commented 6 years ago

Hi, It's woking by following comment above but not on prod environment. Any suggest?

NguyenTienDat commented 1 year ago

Hi, It's woking by following comment above but not on prod environment. Any suggest?

I got same issue with prod mode. I fixed it by add js to angular.json

"scripts": [
              "node_modules/tinymce/tinymce.min.js",
              "node_modules/tinymce/themes/modern/theme.min.js",
              "node_modules/tinymce/plugins/link/plugin.min.js",
              "node_modules/tinymce/plugins/paste/plugin.min.js",
              "node_modules/tinymce/plugins/table/plugin.min.js",
              "node_modules/tinymce/plugins/autoresize/plugin.min.js"
            ],

Just make sure js loaded.