Я человек старый, еще помню времена, когда надо было на страницу подключать десятки библиотек в теге script. Сейчас программирование в JS сильно с тех пор изменилось. Только привыкаешь к webpack, появляются новые инструменты. И вот недавно только разбирался и кастомизировал как сделать MPA на vue-cli а сейчас уже есть vite и он вроде как быстрее. Parcel опять же. Принцип одинаковый.
Vite, Parcel создают скомпилированные, сжатые файлы с хешами, чтобы не надо было там вручную версии библиотек менять 🙂 да, было у меня и такое. Но я привык к webpack и там у меня работал плагин manifest, который в JSON формате показывал все файлы, которые были скомпилированы, с правильными хешами и вот это все.
Ну я перешел на Parcel а потом и Vite, а там этого нет 🙁 что же делать? Мне же надо эти файлы в моем PHP проекте как то подключить.
А ларчик открывается очень просто. Давайте покажу пример.
Делаем проект на Vite
npm run build
и у нас есть готовый проект, закидывай на сервер, запускай index.html и вот тебе SPA приложение. Но что если у нас сервер на PHP и нам надо это внедрить в наш PHP код?
Если мы посмотрим в наш сгенерированный index.html файл, увидим там как подключаются наши JS и CSS скрипты
Ищем наш исходный index.html файл, который является точкой запуска приложения. Выглядит он так:
Но на самом деле это еще не все, в файле index.html должны быть правильно прописаны пути.
в файл vite.config.ts добавляем параметр base: «/dist/» с путем, где от корня будут лежать наши файлы.
Теперь наши файлы с правильными путями:
