Здравствуйте. Сейчас есть десктопное приложение, и возникла необходимость подружить его с Webpack.
Структура приложения раньше:js/ <!-- В папке лежат некие модули, которые экспортируются в глобальную область при подключени -->
modules/
module-1.js
module-2.js
module-3.js
nav.js
main.js
css/
controls.css
ui.css
pages/
users/
user-page.html <!-- В этом файле подключается user-page.js -->
user-page.js
tasks/
single-task.html <!-- В этом файле подключается tasks.js -->
task-list.html <!-- В этом файле подключается tasks.js -->
tasks.js
index.html <!-- В этом файле подключаются все .js и .css файлы из папок js и css -->
Суть работы:
"Роутингом" занимается
nav.js
. При необходимости подгружает , понимает из её кода, что нужно загрузить тот или иной файл, в котором соде
- При необходимости через XHR получает ту или иную html-страницу из папки
pages
- Из кода страницы понимает, нужно ли подгружать дополнительные
.js
файлы с логикой этой страницы
- Добавляет
script
теги в документ, скрипты загружаются
- В этих подгружаемых
.js
файлах содержится объявление той или иной страницы (nav.js
экспортирует в глобальную область функцию для объявления страниц и логики для них)
- Объявлённая страница записывается в кэш внутри
nav.js
- html-код страницы рендерится в специальный контейнер
- Вызывается объявлённая в пункте 4 функция, которая определяет поведение страницы при её готовности
- Следующее обращение к странице происходит уже с использованием кэша (пункт 5)
Как можно организовать ту же структуру, но с использованием Webpack? Использование библиотек React.js и подобных не предусмотрено.