Импорт внешних библиотек на сайт Wix

Я разработал приложение React с использованием CRA и пытаюсь разместить его на существующей странице wix. С WIX я могу использовать файлы javascript, поэтому я объединил код своего приложения с зависимостями в один файл и попытался скопировать и вставить код реакции и реакции-дома из его официального cdn в свой каталог.

Почему-то это все еще не работает, в react-dom.js я вижу ошибку:

'window' is not defined

Хотя сейчас я пытаюсь импортировать только с помощью react и react-dom, проблема в основном касается импорта js-библиотек фронтенда в WIX.

Мне нужно, чтобы код приложения размещался на странице wix, но я думаю, что он должен работать нормально, если я добавлю зависимости приложения с помощью cdns из iframe, как в эту тему, а затем ссылаться на нее, используя синтаксис wix

let React = $w("#elementid").window.React;

чтобы получить iframe, а оттуда получить ссылку на React/другую библиотеку. iFrame (элемент HTML WIX) размещается в том же источнике.

Я также могу использовать код node.js и модули npm, перечисленные здесь

Мысли?


person WestedCrean    schedule 17.12.2018    source источник


Ответы (1)


Вы не можете использовать нативный код реакции непосредственно на странице кода Wix.

Вы можете написать HTML-документ и загрузить его в свой элемент iframe, но код должен будет выполняться в iframe из соображений безопасности. Вы можете обмениваться сообщениями между iframe и кодовой страницей Wix, используя функции postMessage и onMessage только для элемента iframe.

https://www.wix.com/code/reference/$w.HtmlComponent.html

https://support.wix.com/en/article/wix-code-working-with-the-html-element

Вы можете включать пакеты nodejs (после утверждения), если они не пытаются напрямую манипулировать dom. Вы должны думать о странице кода Wix так же, как о структуре jquery. Существует селектор области главной страницы $w, где находятся элементы вашей страницы. Только элементами, определенными в вашем редакторе Wix, можно управлять с помощью селектора области действия $w или соответствующих обработчиков событий.

Единственный способ использовать javascript, который манипулирует dom напрямую или через фреймворк, такой как react, — это песочница в iframe с использованием htmlComponent.

person SteveC    schedule 27.12.2018