Ваш проект разросся и необходимо его разделить на модули. Модули помогают обеспечить изолированность кода и внести порядок в проект. Но для работы с модулями необходимо настроить загрузчик модулей (удостоверьтесь с помощью сервиса caniuse.com что модули поддерживаются не везде).
Используйте следующую структуру, чтобы настроить экспорт в бандл:
- каталог
src
:- каталог
css
- файл
style.css
(в качестве содержимого используйтеbody { color: #999; }
)
- файл
- каталог
js
- файл
app.js
(в качестве содержимого используйтеconsole.log('app worked')
)
- файл
- файл
index.html
(шаблон для HTMLWebpackPlugin) (содержимое файла - произвольно, скрипты и стили должны подключаться автоматически, за счёт использования HTMLWebpackPlugin и MiniCssExtractPlugin) - файл
index.js
(Webpack entry point)
- каталог
- файл
webpack.config.js
- файл
package.json
- другие файлы
Убедитесь, что после экспорта, бандл запускается и работает (создайте для этого скрипт в npm, который запускает HTTP-сервер для каталога dist
). HTTP-сервер выберите сами.