Я начал использовать API dat.GUI с Three.js, и мне было интересно, как лучше всего настроить графический интерфейс из нескольких файлов. Я хотел бы добавить новые контроллеры в один и тот же экземпляр графического интерфейса из разных файлов на основе структуры моего проекта, например. добавьте контроллеры, связанные с камерой, в один файл, добавьте контроллеры, связанные со светом, в другой файл, но все в один и тот же графический интерфейс.
Я попытался экспортировать экземпляр GUI из первого файла и импортировать его во второй файл, но переменная gui оказалась неопределенной.
// file with camera settings
import * as dat from 'three/examples/js/libs/dat.gui.min.js';
export const gui = new dat.GUI();
let guiController = { moveModel: true };
gui.add(guiController, 'moveModel');
// file with light settings
import { gui } from <file with camera settings>;
const dir = new SpotLight(0xdeaa88, 1);
gui.add(dir, 'intensity', 0, 2, 0.01);
Как я могу эффективно настроить один и тот же графический интерфейс из нескольких файлов? Я считаю, что решение моей проблемы находится где-то в передаче JSON или использовании localStorage, но я не нашел четких реализаций в Интернете, поэтому эта тема может помочь будущим учащимся.
but the gui variable is said to be undefined.
Можете ли вы пролить свет на это? Можете ли вы рассказать, какие шаги сборки (если они есть) вы используете, возможно, как это размещается? - person stealththeninja   schedule 25.07.2020import * as gui from '../entry.js'
, поскольку графический интерфейс присутствует в импортированном объекте, но по какой-то причине мне не удается его использовать. Я считаю, что это связано с неверными представлениями об импорте/экспорте от моего имени. Ваше решение singleton pattern работает отлично! - person afkqs   schedule 25.07.2020