tinymce-vue: Trying to load TinyMCE as a standalone (non-cloud) free installation but still get the This domain is not registered message

I have wrapped the call to the tinyMCE inside another VUE component (warapper) called Wysiwyg as below:

   import editor from '@tinymce/tinymce-vue';

    export default {

        name: 'Wysiwyg',

        components: { editor },

    }

This works but show the dreaded message: This domain is not registered with TinyMCE Cloud. Start a free trial to discover our premium cloud services and pro support.

I don’t want to use cloud but want to run the tinyMCE as a standalone editor for my project.

What should I do?

About this issue

Original URL
State: closed
Created 6 years ago
Comments: 19 (4 by maintainers)

Most upvoted comments

Just a heads up. You don’t have to copy the skins and themes to the public folder

import editor from '@tinymce/tinymce-vue'

import 'tinymce/tinymce'

// Theme
import 'tinymce/themes/silver/theme'

// Skins
import 'tinymce/skins/ui/oxide/skin.min.css'
import 'tinymce/skins/ui/oxide/content.min.css'
import 'tinymce/skins/content/default/content.min.css'

// Plugins
import 'tinymce/plugins/fullscreen'
import 'tinymce/plugins/paste'
import 'tinymce/plugins/autoresize'

+10

Mintonne on May 29, 2019

Here ya go https://gist.github.com/Pyronerd62/b361822cce661152a80cdeb80a2ddb7f

Pyronerd62 on May 22, 2019

For anyone struggling with this the documentation isn’t helpful at all. This is how I resolved the issue. First Import tinymce and copy the skins folder.

npm install tinymce --save
cp -r node_modules/tinymce/skins skins

To be safe I manually moved the skins folder to my public folder and then added this to my main.js

import "tinymce/tinymce"
import "tinymce/themes/silver" 
import "../public/skins/ui/oxide/skin.min.css"
import "../public/skins/ui/oxide/content.min.css"
import "../public/skins/content/default/content.min.css"

Then you can use the editor in any component you want.

Pyronerd62 on Feb 7, 2019

Just a heads up. You don’t have to copy the skins and themes to the public folder

import editor from '@tinymce/tinymce-vue'

import 'tinymce/tinymce'

// Theme
import 'tinymce/themes/silver/theme'

// Skins
import 'tinymce/skins/ui/oxide/skin.min.css'
import 'tinymce/skins/ui/oxide/content.min.css'
import 'tinymce/skins/content/default/content.min.css'

// Plugins
import 'tinymce/plugins/fullscreen'
import 'tinymce/plugins/paste'
import 'tinymce/plugins/autoresize'

For anyone who get the “Uncaught SyntaxError: Unexpected token ‘<’” error message to load icons.js while using tinymce v5.5.0 + , just add this code to import icons:

// icons
import 'tinymce/icons/default'

cospring on Oct 29, 2020

I wonder why there is not even a single example of how to use standalone tinymce with package manager! All examples use tiny cloud cdn.

codehunter12345 on Jul 26, 2020