How can I use tinymce editor via meteor npm install --save tinymce


#1

Hello,

The following code does not work, the textarea is not visible.
The tinymce editor is also not visible.
How can I fix? There is no error in the console.

import tinymce from 'tinymce';
import 'tinymce/themes/modern/theme';
import 'tinymce/plugins/paste/plugin';
import 'tinymce/plugins/link/plugin';
import 'tinymce/plugins/autoresize/plugin';

import './question.html';

Template.Page_question.onCreated(function() {
  this.errors = new ReactiveDict();
});

Template.Page_question.onRendered(function() {
  tinymce.init({ 
    selector: '#desc',
    skin: false,
    plugins: ['paste', 'link', 'autoresize']
  });
});

Regards


#2

I am getting closer, now I have the following:
What is the correct order to include the css files, how can I can include the fonts from the same file without moving the font files manually to public folder?

import tinymce from 'tinymce';
import 'tinymce/themes/modern';
import 'tinymce/themes/inlite';
import 'tinymce/plugins/paste/plugin';
import 'tinymce/plugins/link/plugin';
import 'tinymce/plugins/autoresize/plugin';

import 'tinymce/skins/lightgray/content.inline.min.css';
import 'tinymce/skins/lightgray/content.min.css';
import 'tinymce/skins/lightgray/content.mobile.min.css';
import 'tinymce/skins/lightgray/skin.min.css';
import 'tinymce/skins/lightgray/skin.mobile.min.css';

import './question.html';

Template.Page_question.onCreated(function() {
  this.errors = new ReactiveDict();
});

Template.Page_question.onRendered(function() {
  //we need to remove the old instances.
  tinymce.EditorManager.editors = [];
  
  tinymce.init({ 
    selector: '#desc',
    skin: false,
    menubar: false
  });

});