← Cloudflare Pages / pages / framework-guides

Angular

Angular ↗ je nesmírně oblíbený framework pro tvorbu reaktivních a výkonných frontendových aplikací.

V tomto průvodci vytvoříte novou aplikaci Angular a nasadíte ji pomocí Cloudflare Pages.

Vytvořte nový projekt pomocí `create-cloudflare` CLI (C3)

Použijte create-cloudflare ↗ CLI (C3) pro nastavení nového projektu. C3 vytvoří nový adresář projektu, spustí oficiální nastavovací nástroj frameworku Angular a nabídne možnost okamžitého nasazení.

Chcete-li použít create-cloudflare k vytvoření nového projektu Angular spusťte následující příkaz:

npm create cloudflare@latest -- my-angular-app --framework=angular --platform=pages

create-cloudflare nainstaluje závislosti, mimo jiné Wrangler CLI a adaptér Cloudflare Pages a položí vám otázky k nastavení.

Integrace Git

Kromě Direct Upload nasazení můžete projekty nasazovat prostřednictvím Integrace Git. Integrace s Gitem umožňuje propojit repozitář GitHub nebo GitLab s vaší aplikací Pages, díky čemuž se aplikace Pages po každém novém commitu automaticky sestaví a nasadí.

Nastavení vyžaduje základní znalost Git ↗. Pokud s Gitem začínáte, podívejte se na shrnutá příručka ke Gitu ↗ jak nastavit Git na svém lokálním počítači.

Vytvořte repozitář GitHub

Vytvořte nový repozitář GitHub na repo.new ↗. Po vytvoření nového repozitáře přejděte do adresáře nově vytvořeného projektu a v terminálu spusťte následující příkazy, kterými připravíte a odešlete svou místní aplikaci na GitHub:

# Skip the following three commands if you have built your application
# using C3 or already committed your changes
git init
git add .
git commit -m "Initial commit"

git branch -M main
git remote add origin https://github.com/<YOUR_GH_USERNAME>/<REPOSITORY_NAME>
git push -u origin main

Vytvořte projekt Pages

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.
Vyberte Pages kartě.
Vyberte Importujte existující repozitář Git.
Vyberte nově vytvořený repozitář GitHub a poté vyberte Zahájit nastavení.
V Nastavení sestavení a nasazení sekci uveďte následující informace:

Konfigurační možnost	Hodnota
Produkční větev	`main`
Příkaz sestavení	`npm run build`
Adresář sestavení	`dist/cloudflare`

Volitelně můžete přizpůsobit Název projektu pole. Ve výchozím stavu odpovídá názvu repozitáře GitHub, ale shodovat se nemusí. Název projektu hodnota se přiřadí jako váš *.pages.dev subdoména.

Po dokončení konfigurace vyberte Save and Deploy.

Podívejte se na svůj první probíhající deploy pipeline. Pages nainstaluje všechny závislosti a sestaví projekt podle zadání. Cloudflare Pages automaticky znovu sestaví váš projekt a nasadí ho při každém novém pushnutém commitu.

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 nasazením těchto změn do produkce.

Zjistit více

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