Как заполнить или имитировать глобальный (оконный) навигатор с помощью Next.js Вавилон?

#javascript #node.js #babeljs #next.js #es6-modules

#javascript #node.js #babeljs #next.js #es6-модули

Вопрос:

Мы используем сторонний node_module , который ожидает найти глобальный navigator.useragent , которого нет в серверной среде рендеринга узла.

Как правило, для наших собственных пакетов мы import { window } from '../utils/globals' используем window функциональность, но у нас нет возможности редактировать это node_module .

Я не уверен, как автоматически предоставлять window.navigator этот конкретный пакет (или все пакеты), и похоже, что мы используем не Webpack, а yarn/next / babel .

Как мне создать глобальную переменную во время процесса компиляции / переноса?

Ответ №1:

Решение состояло в том, чтобы создать глобальную / контекстную переменную перед _app.jsx определением класса.

 import App, { Container } from 'next/app';
if (typeof global.navigator === 'undefined') global.navigator = {};
// const navigator = {};

class MyApp extends App {
    // ...
}
  

Я попытался добавить его туда, куда мы импортируем пакет-нарушитель, но это не сработало. Не уверен в особенностях передачи рендеринга на стороне сервера / клиента, и, вероятно, есть более утонченный, адаптированный способ справиться с ситуацией.