Babel, ES6, Webpack - Уничтожение деструктурированного импорта

Question

Работа над приложением, которое началось как create-react-app.

В моем коде есть несколько именованных импортов, написанных так:

import {Banana, Apple} from 'fruits'

Модуль fruits - это папка с index.js, в которой где-то есть export {Banana} from './banana'. ./banana экспортирует объект Banana = {bite: ()=>{}}.

Так что я ожидаю, что Foo будет тем объектом, экспортируемым в banana.

Теперь я пытаюсь сделать что-то вроде

const {bite} = Banana;

Пакет успешно собирается, но когда я его запускаю - он не работает, говорит, что не может получить bite из undefined.

И что действительно странно для меня - раньше этого не было, но потом это начало происходить без особой причины. Но иногда это случалось и с Jest - ему не удалось импортировать bite из неопределенного.

Прямо сейчас я просто делаю

import {Banana} from 'fruits/banana';
import {Apple} from 'fruits/apple';

и так прекрасно работает. Тем не менее, я хочу, чтобы это было

import {Banana, Apple} from 'fruits';
const {bite} = Banana;

Есть идеи о том, что могло вызвать это?

Что я должен сделать, чтобы сохранить код так, как я хочу (см. Выше)?

Answer 1

В конце концов, оказалось, что это была проблема циклической зависимости в наших собственных специфических настройках (иногда веб-пакет возвращает undefined для сценариев, которые либо напрямую, либо не ссылаются на сценарии, в которых они используются.

У нас был скрипт index.js в каждой папке (например, fruits), и один из модулей использовал другой (например, Banana использовал импорт Pineapple из fruits вместо прямой ссылки на него, fruits/Pineapple)

Эта проблема, раз и навсегда, научила меня использовать циркуляр-зависимый-плагин в каждой моей сборке веб-пакета (и избегать циклических зависимостей)