Laravel 10 + Vue 3 + Vite + Self hosted

[CambPr]

I would like to use the self-hosted version of tinymce in my Laravel 10 application using Vue 3 and Vite.

Here is what I did:

• npm install tinymce @tinymce/tinymce-vue
• In my Vue-file

<script setup>
import Editor from '@tinymce/tinymce-vue';
...
</script>

<template>
<Editor .../>
...
</template>

Problem: The wrapper always loads tinymce from cdn instead from the local installation. It is not clear to me, on how this could be fixed.

Do I have to use the tinymce-script-src option? If so, how do I have to configure Vite to copy tinymce.min.js to public? And which path do I have to specify?

Thanks for any hint.

[TinyITAdmin]

Ref: INT-3189

[CambPr]

What does Ref: INT-3189 reference to?

[Derkyela]

@CambPr this helped me: https://forum.vite.net/topic/5753/using-tinymcs-wysiwig-editor/2

I just imported everything into my app.js then it does not load tiny via cdn. Alternatively you could try https://github.com/tinymce/tinymce-vue/issues/369#issuecomment-1480676674.

[newalway]

composition api can use

<script setup>
import { defineAsyncComponent , h, ref ,inject,watch ,provide,computed } from 'vue'
const Editor = defineAsyncComponent(() => import ('@tinymce/tinymce-vue'))
</script>
<template>
<Editor .../>
...
</template>

[Pezhvak]

If anyone else had this issue, just import tinymce before importing the component.

[okaroir]

??????