Laravel 10 + Inertia + Vue 3 + Vite + Ошибка самостоятельного размещения

Я хочу добавить TinyMCE как самостоятельный хостинг, но получаю следующую ошибку. Где я ошибаюсь?

https://www.tiny.cloud/docs/tinymce/6/vue-pm/

Вы попробовали выполнить действия по этому адресу, но это все равно не сработало. Он не загрузился как самостоятельный и запросил ключ.

Я боролся с этим уже два дня, но так и не смог добиться успеха. Если решения нет, можете ли вы порекомендовать другой редактор, кроме Quill?

Консоль ошибок;

 php artisan inertia:start-ssr
Starting SSR server on port 13714...
Inertia SSR server started.
ReferenceError: window is not defined
    at mediaMatch (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:957:57)
    at DeviceType (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:615:35)
    at Object.detect$3 [as detect] (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:948:26)
    at /Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:958:53
    at /Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:605:17
    at detect$2 (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:959:28)
    at /Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:962:24
    at Object.<anonymous> (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:31756:3)
    at Module._compile (node:internal/modules/cjs/loader:1378:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1437:10)
node:internal/process/promises:289
            triggerUncaughtException(err, true /* fromPromise */);
            ^

ReferenceError: window is not defined
    at mediaMatch (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:957:57)
    at DeviceType (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:615:35)
    at Object.detect$3 [as detect] (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:948:26)
    at /Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:958:53
    at /Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:605:17
    at detect$2 (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:959:28)
    at /Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:962:24
    at Object.<anonymous> (/Applications/XAMPP/xamppfiles/htdocs/W/INERTIA/node_modules/tinymce/tinymce.js:31756:3)
    at Module._compile (node:internal/modules/cjs/loader:1378:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1437:10)

Node.js v21.6.2

Редактор.vue

<template>
    <editor
        api-key = "no-api-key"
        v-model = "model" model-events = "" @selectionChange = "changes"
        :init = "init"
    />
</template>

<script>
import { defineComponent } from 'vue'

//TinyMCE
import tinymce from 'tinymce';
import 'tinymce/icons/default/icons'
import 'tinymce/themes/silver/theme'
import 'tinymce/models/dom/model'
import 'tinymce/skins/ui/oxide/skin.css'
//import {contentUiCss} from 'tinymce/skins/ui/oxide/content.css';

//TinyMCE plugins
//https://www.tiny.cloud/docs/tinymce/6/plugins/
import 'tinymce/plugins/lists/plugin'
import 'tinymce/plugins/link/plugin'
import 'tinymce/plugins/image/plugin'
import 'tinymce/plugins/table/plugin'
import 'tinymce/plugins/code/plugin'
import 'tinymce/plugins/wordcount/plugin'

import 'tinymce/langs/tr'

import Editor from '@tinymce/tinymce-vue'

export default defineComponent({
    props: ['modelValue'],

    components: {'editor':Editor},

    emits: ['update:modelValue'],
    data() {
        return {
            model: this.modelValue,
            init: {
                entities : "Ü = Ü ü = ü Ç = Ç ç = ç Ö = Ö ö = ö Ş = Ş ş = ş Ğ = Ğ ğ = ğ İ = İ ı = ı",
                valid_elements: "*[*]",
                skin: false,
                plugins: 'lists link image table code wordcount',
                content_css: false,
                //content_style: contentUiCss.toString(),
                language: 'tr',
                promotion: false,
                convert_urls: false,
            }
        }
    },
    methods: {
        changes(event,editor){
            this.$emit('update:modelValue', editor.getContent())
        }

    }
})
</script>

Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Оживление вашего приложения Laravel: Понимание режима обслуживания
Оживление вашего приложения Laravel: Понимание режима обслуживания
Здравствуйте, разработчики! В сегодняшней статье мы рассмотрим важный аспект управления приложениями, который часто упускается из виду в суете...
Коллекции в Laravel более простым способом
Коллекции в Laravel более простым способом
Привет, читатели, сегодня мы узнаем о коллекциях. В Laravel коллекции - это способ манипулировать массивами и играть с массивами данных. Благодаря...
Поиск нового уровня в Laravel с помощью MeiliSearch и Scout
Поиск нового уровня в Laravel с помощью MeiliSearch и Scout
Laravel Scout - это популярный пакет, который предоставляет простой и удобный способ добавить полнотекстовый поиск в ваше приложение Laravel. Он...
Освоение архитектуры микросервисов с Laravel: Лучшие практики, преимущества и советы для разработчиков
Освоение архитектуры микросервисов с Laravel: Лучшие практики, преимущества и советы для разработчиков
В последние годы архитектура микросервисов приобрела популярность как способ построения масштабируемых и гибких приложений. Laravel , популярный PHP...
Как построить CRUD-приложение в Laravel
Как построить CRUD-приложение в Laravel
Laravel - это популярный PHP-фреймворк, который позволяет быстро и легко создавать веб-приложения. Одной из наиболее распространенных задач в...
0
0
114
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Я решил проблему, исключив страницу с Tinymce из SSR.

добавить файл app.blade;

    @php
       if (Request::is('panel/*')){
           $__inertiaSsrDispatched = true;
           $__inertiaSsrResponse = null;
       }
    @endphp

Другие вопросы по теме