Reuse ES6 fetch object

Question

Я использую webpack для связывания своего JS, поэтому я могу использовать его на сервере и клиенте. Одна вещь, которую мне трудно найти, - это использовать объект извлечения в обоих местах. На стороне сервера, есть узел выборки

import fetch from 'node-fetch'; 

и на стороне клиента, я не импортировать ничего и window.fetch объект должен быть использован.

Есть ли способ условно импортировать объект выборки, чтобы он использовался на стороне сервера с node-fetch и использовался клиентской стороной с window.fetch?

Я попытался это:

if(window == null) { 
    import fetch from 'node-fetch'; 
} 

но импорт должен быть 'верхний уровень'

Я также попытался мутирует выборки объекта, если окно присутствует:

import fetch from 'node-fetch'; 

if(window) fetch = window.fetch; 

но fetch становится только для чтения.

Есть ли работа вокруг? В настоящее время у меня есть 2 файла с импортом и один без (для сервера/клиента соответственно), но я хочу избежать дублирования кода.

Answer 1

Это должно работать:

var fetch = window?window.fetch:require('node-fetch').fetch; 

Отредактировано

Если вы находитесь на строгом режиме, как Mike прокомментировал ниже:

var fetch = typeof window === 'object' && 
    window?window.fetch:require('node-fetch').fetch; 

Answer 2

Вы можете создать модуль, который условно возвращающую правильный выбор, а не импорт node-fetch напрямую:

/* fetch.js */ 
// default to native fetch, if available 
let activeFetch = fetch; 

if (!activeFetch) { 
    activeFetch = require('node-fetch'); 
} 

export default activeFetch; 

Затем вы можете импортировать обертку и она должна содержать правильную версию для каждой среды:

import fetch from './fetch'; 
// should be node-fetch for server, window.fetch for client-side