Lovable.dev je orodje umetne inteligence, ki iz opisov ustvarja spletne aplikacije – večinoma projekte React + Vita. Rezultat je delujoče spletno mesto, ki pa ostaja na infrastrukturi Lovable z omejenimi možnostmi. V tem priročniku vam bomo pokazali, kako prenesti kodo in stran na lastno gostovanje .
1. korak: Izvozite projekt iz Lovable
Lovable povezuje vsak projekt z repozitorijem GitHub:
- Odprite svoj projekt v urejevalniku Lovable
- Kliknite ikono GitHub (ali pojdite v Nastavitve → GitHub )
- Če še niste povezali GitHuba, vas bo Lovable prosil za avtorizacijo dostopa – sprejmite.
- Projekt bo samodejno prenesen v vaš račun GitHub kot novo skladišče.
Lahko pa kodo prenesete tudi neposredno: v urejevalniku Lovable kliknite Prenesi (če je možnost na voljo) ali klonirajte repozitorij iz GitHuba na svoj računalnik.
2. korak: Projekt zgradite lokalno
Lovable ustvari projekt React/Vite, ki ga je treba zgraditi pred nalaganjem na gostovanje:
- Odprite terminal in se pomaknite do mape projekta
- Odvisnosti namestitve:
npm install - Zaženite gradnjo:
npm run build - Po gradnji mapa
dist/vsebuje že pripravljene datoteke za gostovanje.
Nimate Node.js? Prenesite ga z nodejs.org – potrebujete ga samo za gradnjo, na samem gostovanju ga ne potrebujete, ker so rezultat statične datoteke HTML/CSS/JS.
3. korak: Nalaganje na gostovanje
Vsebino mape dist/ morate naložiti v public_html na vašem gostovanju. Na voljo imate več možnosti:
- FTP/SFTP: uporabite FileZillo — povežite se s strežnikom in kopirajte vsebino
dist/v datotekopublic_html - Upravitelj datotek cPanel: stisnite mapo
dist/v ZIP, naložite vpublic_htmlin razpakirajte - Namestitev Gita: za samodejno namestitev uporabite nadzor različic Gita v cPanelu (glejte naš vodnik za namestitev Gita )
4. korak: Konfigurirajte usmerjanje za SPA
Aplikacije React uporabljajo usmerjanje na strani odjemalca. Brez dodatne konfiguracije bo neposreden dostop do katere koli poti, razen domače strani, vrnil napako 404. Rešitev je datoteka .htaccess :
Ustvarite datoteko .htaccess v public_html s to vsebino:
RewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L]To preusmeri vse zahteve naRewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L]
index.html in usmerjevalnik React prevzame nadzor.
5. korak: Podatkovna baza Supabase
Če vaš projekt Lovable uporablja Supabase za bazo podatkov in preverjanje pristnosti, imate dve možnosti:
- Nadaljujte z uporabo Supabase: Supabase deluje kot zunanja storitev – vaše gostovanje služi le vmesniku, klici API-ja pa gredo v Supabase. V kodi vam ni treba ničesar spreminjati.
- Selitev na MySQL: Če želite imeti vse na enem mestu, boste morali prepisati logiko zalednega sistema v PHP + MySQL. To je večji podvig in je odvisen od kompleksnosti aplikacije.
6. korak: Domena in SSL
- V nastavitvah aplikacije Lovable odstranite domeno po meri (če ste jo nastavili)
- Usmerite svojo domeno na gostovanje WMD – spremenite imenske strežnike ali zapis A
- Aktivirajte SSL potrdilo v cPanelu pod možnostjo Stanje SSL/TLS
Potrebujete pomoč pri migraciji projekta Lovable? Kontaktirajte nas na info@wmd.hr ali prek klepeta v živo – tukaj smo 24 ur na dan, 7 dni v tednu.