Lovable.dev samodejno shrani vsak projekt na GitHub. To pomeni, da lahko nastavite samodejno uvajanje – vsakič, ko v urejevalniku Lovable naredite spremembo, se stran na vašem gostovanju samodejno posodobi. Takole je opisano, kako to nastavite.
Kako to deluje
Tok podatkov izgleda takole:
- Stran urejate v urejevalniku Lovable
- Lovable samodejno pošlje spremembe na GitHub
- GitHub pošlje webhook v cPanel
- cPanel potegne novo kodo in jo namesti na gostovanje
Rezultat: stran je objavljena na vaši domeni in še naprej uporabljate Lovable za urejanje.
Predpogoji
- Prikupen projekt, povezan z GitHubom (odpri projekt → Nastavitve → GitHub )
- Paket gostovanja WMD z dostopom do cPanela
- Projekt Lovable mora biti zgrajen z Reactom/Viteom – kar je privzeto tudi on.
1. korak: Zgradite projekt in potisnite mapo dist
Lovable naloži izvorno kodo na GitHub, vendar gostovanje potrebuje pripravljene (build) datoteke. Imate dve možnosti:
Možnost A: Ročna gradnja + potisk mape dist
- Klonirajte repozitorij na svoj računalnik:
git clone https://github.com/tvoj-user/projekt.git -
npm install -
npm run build - Dodajte mapo
dist/v Git (odstranite jo iz.gitignore, če je tam) - Potrdi in potisni:
git add dist/ && git commit -m "build" && git push
Možnost B: Samodejna gradnja dejanj GitHub (priporočeno)
V repozitoriju ustvarite datoteko .github/workflows/build.yml :
name: Build and Deploy on: push: branches: [main] jobs: build: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - uses: actions/setup-node@v4 with: node-version: '20' - run: npm install - run: npm run build - run: || git config user.name "GitHub Actions" git config user.email "actions@github.com" git add dist/ -f git commit -m "Auto build" || exit 0 git pushTa delovni tok se sproži vsakič, ko Lovable pošlje spremembe – samodejno zgradi projekt in jih pošlje.name: Build and Deploy on: push: branches: [main] jobs: build: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - uses: actions/setup-node@v4 with: node-version: '20' - run: npm install - run: npm run build - run: || git config user.name "GitHub Actions" git config user.email "actions@github.com" git add dist/ -f git commit -m "Auto build" || exit 0 git push
dist/ mapa.
2. korak: Nastavite repozitorij Git v cPanelu
- V nadzorni plošči cPanel pojdite na Datoteke → Nadzor različic Git™
- Kliknite Ustvari.
- Omogoči kloniranje repozitorija
- Vnesite URL klona vašega repozitorija GitHub
- Pot do repozitorija:
/home/korisnik/repositories/lovable-projekt - Kliknite Ustvari.
3. korak: Ustvarite datoteko .cpanel.yml
Dodajte datoteko .cpanel.yml v koren repozitorija:
--- deployment: tasks: - export DEPLOYPATH=/home/korisnik/public_html/ - /bin/cp -R dist/* $DEPLOYPATHZamenjaj--- deployment: tasks: - export DEPLOYPATH=/home/korisnik/public_html/ - /bin/cp -R dist/* $DEPLOYPATH
korisnik z njegovim uporabniškim imenom v cPanelu. Potrdite in pošljite to datoteko.
4. korak: Nastavite spletni kavelj za samodejno uvajanje
- V cPanelu, na strani repozitorija, kopirajte URL za vlečenje
- Na GitHubu pojdite v Nastavitve → Spletni kavelj → Dodaj spletni kavelj
- URL koristnega nalaganja: prilepite URL za vlečenje iz cPanela
- Vrsta vsebine:
application/json - Kliknite Dodaj spletni kavelj
5. korak: Dodajte .htaccess za usmerjanje SPA
Dodajte .htaccess v public_html (ali ga vključite v dist/ prek konfiguracije Vita):
RewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L]PreizkusRewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L]
- V urejevalniku Lovable naredite majhno spremembo
- Počakajte, da se dejanja GitHub končajo z gradnjo (1–2 minuti)
- cPanel bo samodejno prenesel spremembe in jih namestil
- Osvežite svojo domeno – sprememba bi morala biti vidna
Zdaj imate najboljše iz obeh svetov: odlično za vizualno urejanje in gostovanje WMD za zanesljivo delovanje spletnih mest na vaši domeni s SSL-jem in e-pošto. Potrebujete pomoč pri nastavitvi? Pišite nam na info@wmd.hr – tukaj smo 24 ur na dan, 7 dni v tednu.
