← Cloudflare Pages / pages / framework-guides

Vite 3

Vite ↗ je nástroj pro sestavování nové generace určený frontendovým vývojářům. S vydání Vite 3 ↗, mohou vývojáři využít nová vylepšení příkazového řádku (CLI), výchozí šablony a více ↗ k vytváření svých frontendových aplikací.

Cloudflare Pages nativně podporuje projekty Vite 3. Podrobnosti najdete v blogovém příspěvku na vylepšení procesu sestavování Pages ↗, včetně inicializace buildu v řádu zlomků sekundy, kde najdete další informace o použití Vite 3 a Cloudflare Pages k optimalizaci nástrojů pro sestavení vaší aplikace.

V tomto průvodci se naučíte, jak založit nový projekt pomocí Vite 3 a nasadit ho na Cloudflare Pages.

npm create vite@latest

✔ Project name: … vite-on-pages
✔ Select a framework: › vue
✔ Select a variant: › vue

Scaffolding project in ~/src/vite-on-pages...

Done. Now run:

  cd vite-on-pages
  npm install
  npm run dev

Nyní vytvoříte nový repozitář GitHub a nahrajete do něj svůj kód pomocí GitHubu gh příkazový řádek (CLI) ↗:

git init

Initialized empty Git repository in ~/vite-vue3-on-pages/.git/

git add .
git commit -m "Initial commit"                                           vite-vue3-on-pages/git/main +

[main (root-commit) dad4177] Initial commit
 14 files changed, 1452 insertions(+)

gh repo create

✓ Created repository kristianfreeman/vite-vue3-on-pages on GitHub
✓ Added remote [email protected]:kristianfreeman/vite-vue3-on-pages.git

git push

Chcete-li nasadit svůj web do Pages:

V dashboardu Cloudflare přejděte na Workers & Pages stránce.
Přejděte na Workers & Pages ↗
Vyberte Vytvoření aplikace > Pages > Import z existujícího repozitáře Git.
Vyberte svůj nový repozitář GitHub.
V Nastavení sestavení a nasazení, nastavte npm run build jako Příkaz sestavení, a dist jako Výstupní adresář sestavení.

Po dokončení konfigurace vyberte Save and Deploy.

Uvidíte svůj první probíhající deploy pipeline. Pages nainstaluje všechny závislosti a sestaví projekt podle zadání. Po nasazení projektu bude dostupný na <YOUR_PROJECT_NAME>.pages.dev subdoménu. Subdoménu svého projektu najdete v Workers & Pages > vyberte svůj projekt Pages > Deployments.

Cloudflare Pages při každém novém odeslaném commitu automaticky znovu sestaví váš projekt a nasadí ho.

Kromě toho budete mít přístup k náhledová nasazení, které opakují proces sestavení a nasazení pro pull requesty. Díky nim můžete náhled změn ve svém projektu zobrazit na skutečné URL adrese ještě před jejich nasazením do produkce.

Zjistit více

Dokončením tohoto návodu jste úspěšně nasadili svůj web Vite 3 na Cloudflare Pages. Chcete-li začít s dalšími frameworky, podívejte se na seznam návodů pro frameworky.