Посібник

Як розмістити HTML, згенерований у Claude, Lovable або bolt

Оновлено · Dropsite

Коротко: Збережіть результат Claude як один самодостатній index.html або експортуйте проєкт із Lovable чи bolt, зберіть його й запакуйте папку dist у ZIP. Перетягніть файл або ZIP на Dropsite — і за кілька секунд отримаєте посилання, яким можна поділитися, без акаунта, Git і налаштувань деплою.

Інструменти ШІ чудово створюють сторінки, але після них у вас лишається файл або проєкт, а не посилання. Цей посібник допоможе перейти від одного до іншого.

Claude: попросіть один файл

Сторінки з одного файлу найпростіше розмістити. Додайте це до свого промпту:

Помісти все в один самодостатній HTML-файл: вбудуй CSS у тег <style>, а JavaScript — у тег <script>. Завантажуй бібліотеки лише з публічного CDN через https. Не посилайся на локальні файли.

Коли артефакт виглядає як слід, завантажте його (або скопіюйте код у текстовий редактор) і збережіть як index.html. Переконайтеся, що редактор не додав .txt у кінці.

Потім перетягніть index.html на Dropsite. Ви отримаєте посилання на зразок k7m2xq.dropsiteusercontent.com.

Lovable і bolt: експорт, збирання, архів dist

  1. Експортуйте проєкт (завантажте як ZIP або надішліть на GitHub і клонуйте).
  2. У папці проєкту виконайте npm install, а потім npm run build.
  3. Відкрийте папку dist (іноді build або out). Там мають бути index.html і папка assets.
  4. Виділіть усе всередині dist і стисніть. На macOS: правий клік → Стиснути. На Windows: правий клік → Надіслати → Стиснута папка.
  5. Перетягніть ZIP на Dropsite.

Заархівували саму папку dist, а не її вміст? Це теж нормально: якщо в ZIP рівно одна папка з index.html усередині, Dropsite розпакує її за вас.

Якщо посилання всередині застосунку ведуть на порожню сторінку, застосунок використовує маршрутизацію на боці клієнта. Перед збиранням перемкніть роутер у hash-режим (URL на кшталт /#/about) або залиште застосунок на одній сторінці.

Що вміє і чого не вміє статичний хостинг

ПрацюєНе працює
HTML, CSS, JavaScript, зображення, шрифти, PDFСерверний код (Node, Python, PHP)
Запити до публічних API з браузераБази даних, що працюють поруч зі сторінкою
Supabase або Firebase з публічними (anon) ключамиСекретні ключі API — будь-хто прочитає їх у коді сторінки
Маршрутизація через hashРендеринг на сервері та API-маршрути

Обмеження Dropsite: 10 МБ на одне завантаження на тарифі «Безкоштовний» (50 МБ на Pro), до 500 файлів і 50 МБ у розпакованому вигляді на один ZIP.

Спробуйте зараз

Перетягніть HTML, ZIP або PDF і отримайте живе посилання за лічені секунди. Акаунт не потрібен.

Перейти до зони завантаження

Часті запитання

Як завантажити HTML із Claude?

Попросіть Claude зібрати всю сторінку в один HTML-файл, потім натисніть кнопку завантаження або копіювання в артефакті й збережіть його як index.html.

Як розмістити проєкт із Lovable або bolt?

Експортуйте або завантажте проєкт, запустіть збирання (npm run build), потім запакуйте вміст папки dist у ZIP так, щоб index.html був на верхньому рівні архіву, і перетягніть ZIP на Dropsite.

Чи запрацює сторінка з бекендом?

Лише фронтенд. Статичний хостинг не може виконувати серверний код, працювати з базою даних чи зберігати секретні API-ключі. Запити до публічних API з браузера працюватимуть.

Інші посібники