Доброго вечера.
Не до конца уверен, с какой конкретно технологией связано это поведение - кейс весьма странный, и с таким я сталкиваюсь впервые. Есть приложение на Vue + MobX State Tree + Typescript, создал его через Vue Cli третьей версии. Предполагаю, что это либо Webpack, либо Vue Cli так настроил тот же webpack по умолчанию - используются дефолтные webpack конфиги в недрах этой тулзы.
В общем, я создаю стор mobx, и объявляю в отдельном модуле функцию useSnapshot, которая, по задумке, являет собой замыкание над объектом стора. Делается это для того, чтобы все импорты useSnapshot использовали один и тот же инстанс стора.
Проблема в том, что код в useSnapshot.ts исполняется ДО кода в store.ts, но как такое может быть? Я же импортировал модуль! Он должен прийти ко мне полностью зарезольвенным!
// store.ts
import { types } from 'mobx-state-tree';
console.log('store.ts'); // выведется в консоль ВТОРЫМ, должен первым
const store = App.create({
// ...
});
export default store;
// useSnapshot.ts
import { getSnapshot } from 'mobx-state-tree';
import store from '@/store'; // при первом импорте undefined
console.log('useSnapshot.ts'); // выведется в консоль ПЕРВЫМ, должен вторым
// из-за этого не работает корректно данная функция, т.к. она должна
// вызваться в момент импорта и сохранить в себе ссылку на объект стора
// как такое возможно? store.ts ЯВНО импортирован выше
const useSnapshot = (() => {
const _store = store;
return () => getSnapshot(_store);
})();
Почему, даже чисто теоретически, такое может быть? Есть какие-либо идеи или предположения, возможно, вы с таким сталкивались?
Заранее спасибо.