Angular lietojumprogrammu izvietošana GitHub lapās ir lielisks veids, kā tās mitināt bez maksas. Angular ir populārs JavaScript ietvars vienas lapas lietojumprogrammu veidošanai.

Angular ir visaptverošs komandrindas interfeiss, kas atbalsta ātru JavaScript lietojumprogrammu izveidi un iestatīšanu. Angular CLI ir vairākas komandas, lai izveidotu, izveidotu, apkalpotu un ģenerētu lietojumprogrammu komponentus.

Varat arī izmantot CLI, lai izvietotu Angular lietojumprogrammas dažādiem mērķiem, tostarp GitHub lapām.

Ko tev vajag

Lai maksimāli izmantotu šo rokasgrāmatu, jums ir jābūt šādām prasmēm un rīkiem:

  • Jums vajadzētu būt pazīstamam ar Angular pamati, piemēram, lietotņu jēdziens, iestatījumi, URL utt.
  • Jūs esat iepazinušies ar GitHub pamati un Git, piemēram, GitHub konta izveide, Git repozitorija (repo) izveide un GitHub lapas (GH-lapas).
  • Jums ir Angular lietojumprogramma, kas ir gatava izvietošanai.
  • Jūsu pamata URL atrodas pareizajā ceļā. Izvietošana GH lapās neizdodas, jo ir iestatīts nepareizs bāzes href (bāzes URL).
    • instagram viewer
  • GitHub konts.
  • GitHub repozitorijs (repo) ar lietojumprogrammas kodu.

Tagad, kad tas viss ir izveidots, sāksim izvietošanas procesu.

Izvietošanas process

Lai sāktu, jums vajadzēja izveidot savam projektam GitHub repozitoriju un nosūtīt kodu uz galvenais/meistars filiāle.

Pēc tam izveidojiet GH-lapu atzaru.

1. Izveidojiet GH-lapu filiāli

Tas ir uzlauzts, kas palīdzēs jums iegūt GH-lapu saiti, lai palīdzētu iestatīt bāzes href.

Vispirms izveidojiet GH lapas savā lokālajā repozitorijā ar šādu komandu:

git filiāles gh-lapas

Pēc tam pārejiet no galvenās filiāles uz GH lapām, lai pārsūtītu visu kodu.

git checkout gh-lapas

Pēc tam pārsūtiet GH lapas uz GitHub, lai izveidotu attālo GH lapu atzaru.

git push izcelsmes gh-lapas

Rīkjoslā zem repo nosaukuma noklikšķiniet uz Iestatījumi > Lapas.

Zem Būvēšana un izvietošana, atlasiet Izvietot no filiāles. Tālāk atlasiet gh-lapas kā filiāles nosaukumu, pēc tam noklikšķiniet uz Saglabāt. Tādējādi augšējā labajā stūrī zem apzīmējuma GH lapas tiks izveidota saite uz GH lapām.

Pēc tam kopējiet šo saiti uz publicēto vietni, kā parādīts tālāk. Jūs izmantosiet saiti, lai izvietošanas laikā iestatītu bāzes atsauci.

3. Instalējiet Angular-CLI-GHpages

Angular-cli-ghpages pakotne ir rīks, ko Angular CLI izmanto izvietošanas nolūkos.

Dodieties atpakaļ uz savu vietējo projektu repozitoriju. Pēc tam instalējiet un palaidiet angular-cli-ghpages ar šo komandu:

ng pievienot leņķiskās-cli-ghpages

4. Izvietojiet lietotni

Lai izveidotu lietotni ražošanā, jums tā ir jāsavieno ar attālo serveri GitHub.

Konfigurējiet savu lietotni attālajam serverim, izpildot šādu komandu:

ng izvietot --base-href=https://GithubUserName.github.io/GithubRepoName/

Atcerieties aizstāt iepriekš minēto saiti ar tiešo saiti no GH lapām

Veiksmīga konstrukcija izskatīsies šādi:

Pēc tam dodieties uz GitHub un noklikšķiniet uz saites GH-lapas, lai redzētu savu izvietoto projektu.

Apsveicam, jūs esat izvietojis savu Angular lietotni!

Ja saite parāda tikai README failu, lūdzu, atgriezieties pie GitHub GH-lapu iestatījumiem. Pārliecinieties, vai atlasītā filiāle ir gh-lapas, nevis galvenā vai galvenā filiāle. Pēc tam dodiet tai piecas minūtes un atkārtoti ielādējiet. Dažreiz GitHub prasa laiku, lai atspoguļotu izmaiņas.

Lai uzzinātu vairāk par to, kā izmantot Angular CLI izvietošanā, apmeklējiet vietni Leņķiskā dokumentācija.

Kā GitHub lapās izvietot Angular lietotni

Ir vairāki veidi, kā Angular lietotnes izvietot GH lapās, taču šī metode ir vienkāršākā. Jūs iestatāt savu GH-lapu repo saiti un izmantojat to ar Angular-CLI, lai izvietotu savu lietotni GitHub lapās.

Ar Angular un Angular CLI varat paveikt daudz vairāk. Jūtieties brīvi izpētīt. Izmantojiet CLI, lai izvietotu lietotnes GH lapās, lai nodrošinātu savu lietojumprogrammu bezmaksas redzamību un mitināšanu.