Как перенести сайт с Lovable на свой хостинг

Файлы вы уже забрали. Осталось непонятное: куда их класть, что будет с доменом и что именно сломается в момент переключения. Разберём по шагам, включая то, о чём обычно узнают уже после переезда.

Если код ещё не выгружен, начните с разбора про выгрузку, а потом возвращайтесь сюда.

Шаг 1. Понять, что у вас на руках

От этого зависит всё остальное, а спутать легко.

Готовые файлы. В папке лежит index.html, рядом стили и скрипты. Открывается двойным щелчком без интернета. Такое кладётся на хостинг как есть.

Исходники проекта. В папке package.json, папка с исходниками, конфигурация. Двойным щелчком не открывается. Нужен шаг сборки, и только после него получится первый вариант.

Фронтенд с зависимостью от платформы. Внешне похоже на первый вариант, но внутри есть обращения к серверу платформы, и без активного аккаунта данные перестанут приходить. Проверяется поиском по строке http в исходниках.

Третий случай самый неприятный, потому что обнаруживается уже после переключения домена. Проверьте его до, а не после.

Шаг 2. Выбрать, где будет жить

Для готовых файлов без серверной части подходит любой статический хостинг, и почти все они бесплатны на таком объёме.

Netlify Drop. Открываете netlify.com/drop и перетаскиваете папку в окно браузера. Сайт появляется через несколько секунд, без регистрации на первом шаге. Самый быстрый способ увидеть, что всё вообще работает.

GitHub Pages. Кладёте файлы в репозиторий, включаете Pages в настройках. Плюс в том, что у вас заодно появляется история изменений и место, откуда файлы уже никуда не денутся.

Cloudflare Pages, Vercel. То же самое, папкой целиком, плюс быстрая раздача по миру.

Обычный хостинг по FTP. Если хостинг уже оплачен, положите содержимое папки в каталог сайта. Обратите внимание: именно содержимое, а не саму папку, иначе сайт окажется на уровень глубже, чем ожидается.

Совет, который экономит нервы: сначала выложите на временный адрес и посмотрите, и только потом переключайте домен. Пока домен смотрит на старое место, у вас есть возможность спокойно всё починить.

Для статического сайта разница между строками невелика, и все варианты на таком объёме бесплатны или почти бесплатны. Выбирайте по тому, чем уже пользуетесь.

Шаг 3. Переключить домен

Порядок именно такой, и он важен.

1. Выложите сайт на новом хостинге и получите его временный адрес.
2. Откройте этот адрес и пройдите по всем страницам и формам.
3. Только теперь меняйте DNS-записи у регистратора домена на новые.
4. Дождитесь обновления. Обычно это минуты или часы, изредка до суток.
5. Проверьте, что открывается и example.com, и www.example.com.
6. Убедитесь, что сертификат выпустился и сайт открывается по https.

Старую подписку не отменяйте в тот же день. Дайте себе неделю: если что-то пойдёт не так, вернуть DNS обратно займёт минуты, а восстановить удалённый проект уже не получится.

Что ломается при переносе чаще всего

Формы. Это главное. На платформе форма обратной связи работала потому, что её обрабатывал сервер платформы. На статическом хостинге сервера нет, и форма превращается в кнопку, которая ничего не делает. Причём молча: посетитель нажимает «Отправить», ничего не происходит, вы об этом не знаете.

Вариантов замены три, и они различаются по усилию. Обработчик форм от самого хостинга: у Netlify и Cloudflare это делается добавлением одного атрибута в разметку и настраивается за минуты. Сторонний сервис приёма форм: подходит, если хостинг такого не умеет, письма приходят на почту, бесплатного плана обычно хватает. Свой скрипт: нужен, только если данные должны попадать в вашу базу или CRM, и это уже работа для разработчика.

Выберите вариант до переключения домена, а не после первой потерянной заявки.

Абсолютные адреса. Ссылки и картинки, прописанные полным адресом старого сайта, продолжают вести на старый сайт. Пока он жив, вы этого не заметите. Когда его выключат, отвалятся картинки. Поиск по строке http находит их все.

Пути с ведущим слешем. Если сайт лежит не в корне, а в подпапке, ссылки вида /styles.css будут искать файл в корне домена и не найдут. Лечится относительными путями.

Аналитика и пиксели. Счётчики продолжают писать в старый проект либо перестают работать вовсе. Проверьте, что идентификатор ваш и что события приходят.

Адреса страниц. Отдельная неприятность, которую замечают позже всех. На платформе внутренние страницы могли открываться по одному виду адресов, а на новом хостинге открываются по другому: где-то со слешем на конце, где-то без, где-то с расширением .html, где-то без него. Внешне сайт работает, а все ссылки, которые на него вели раньше, приводят на страницу «не найдено». Если у сайта были посетители из поиска, это прямая потеря: поисковик знает старые адреса и ведёт людей по ним. Лечится либо настройкой правил перенаправления на новом хостинге, либо тем, что вы заранее сохраняете прежний вид адресов. Проверить просто: возьмите три любых внутренних адреса со старого сайта и откройте их на новом.

Проверочный список после переключения

Пройдите его в тот же день, а не через неделю. Половина этих пунктов ломается молча, то есть посетитель уходит, а вы об этом не узнаёте.

Откройте главную с телефона, а не только с ноутбука: на статическом хостинге ничего не подстраивается само, и если верстка поехала, она поехала у всех. Пройдите по всем пунктам меню и убедитесь, что ни одна ссылка не ведёт на старый адрес. Отправьте форму сами и проверьте, что письмо дошло. Посмотрите, открывается ли сайт без www и с www. Проверьте, что адрес открывается по https, а не только по http. Загляните в аналитику на следующий день: если посещений ноль, счётчик не переехал.

И отдельно про поиск. Если у старого сайта были позиции, сообщите поисковику о переезде: добавьте новый адрес в панель для вебмастеров и убедитесь, что карта сайта отдаётся с нового места. Без этого страницы будут переиндексироваться дольше, чем могли бы. Про то, как забрать сам код, если вы дошли сюда без него, разобрано отдельно в разборе про выгрузку, а про расход кредитов до переезда в разборе про кредиты.

Как это устроено у нас

Выгрузка не привязана к тарифу, забрать проект можно на любом плане.

В архиве лежит README на вашем языке, и это не список файлов, а инструкция: как открыть сразу, какие именно способы размещения проверены, что делать с исходниками. Написана она для худшего момента, когда человек уходит и раздражён, поэтому короткая и по делу.

Сайт приезжает самодостаточным. Открывается двойным щелчком без сервера и без интернета.

Оговорка про игры и приложения. Они тянут по сети движок отрисовки и React соответственно, оба с zugo.dev. В README написано, какие файлы положить рядом и что поправить, чтобы папка стала полностью автономной.

Обратный ход тоже есть. Если нужно не забрать файлы, а перевезти живую страницу, на стартовом экране есть кнопка «Перенести свой сайт»: даёте адрес, страница забирается как есть и открывается на редактирование. Переносится одна страница по ссылке, ссылки на соседние остаются вести на прежний сайт, шрифты оттуда не переезжают. Переносить можно только своё.

Коротко

Сначала выясните, что у вас на руках: готовые файлы, исходники или фронтенд с привязкой к платформе. Выложите на временный адрес и проверьте. Переключайте домен только после этого, а старую подписку отменяйте через неделю, а не в тот же день. И проверьте формы: они ломаются чаще всего и делают это молча.