Angular

Installer Angular


Af Christian Lyck

Hvordan installerer man og kommer igang med sit Angular projekt.
Angular skal afvikles på en server.

1. Det første du bør gøre er at installerer Node.js. Gå ind på http://nodejs.org/
2. Download og kør installationsfilen (Man kan også, gøre det fra Visual Studio, hvad man kan med det meste, men med denne vejledning går vi uden om Visual Studio)
3. Hvis du allerede har installeret Node.js, Ja det kan du kan tjekke om du allerede har installeret ved at åbne PowerShell højre klik og vælg kør som administrator, skriv derefter npm -v  eller node -v
4. Man kan tjekke om man har seneste version ved at skrive: npm install npm -g
5. Nu skulle Node.js være på plads.
6. Hvis du har brug for at løse problemer omkring sikkerhed, kan du tjekke, hvilken folder der er din globale ved at skrive  npm config get prefix (hvis du lige har installeret Node.js, så husk at genstarte Windows Powershell) min er: C:\Users\christian.lyck\AppData\Roaming\npm
og man kan skifte "owner" ved at skrive chown -R 'IamLyck' <folder>. Dette burde ikke være nødvendigt.
7. Installer nu Ruby, for Windows som er det jeg arbejder med, findes der en installer her: http://rubyinstaller.org/ ellers kan du skrive npm install ruby-sass, det kan dog give problemer så hvis du bruger installeren skal du efterfølgende skrive npm install sass -g
8. Installer Grunt med følgende komando: npm install -g grunt-cli
9. Installer Bower med følgende komando (Det kan være en god ide måske nødvendigt at genstarte PowerShell som administrator)
10. Installer YOman, med følgende komando:  install --global yo
11. Generators er ligesom projekter, der findes en hel del, se her http://yeoman.io/generators/  men for et typisk projekt kan man bruge følgende kommando. npm install --global generator-webapp , det kunne også være npm install -g angularjs, når "generatoren" er installeret globalt kan den efterfølgende bruges til at oprette projekter efter.
12. Det vil vi nu gøre for at oprette et projekt.
13. Opret en folder, der hvor du har dine projekter FX mkdir  ngTest
14. Vær sikker på du står i den rigtigt folder FX (C:\Projects\ngTest) med din PowerShell kommand, tast nu yo og du vil få en menu du kan vælge template ud fra.

15. Vælg den type projekt du vil bygge og følg vejledningen, du vil nok blive spurgt om hvilken biblioteker du vil have med osv.
16. Nu vil jeg forslå at du downloader Atom, det kan også være et andet værktøj.   https://atom.io/
17. Åben dit projekt i Atom
18. Nu skal du åbne en ny PowerShell konsol i samme folder, lad den anden konsol forsat være åben.
19. I den nye konsol skal du skrive: grunt serve og dit projekt vil åbne i en browser.

Dette er bare en start, der er selvfølge en massen andet man kan gøre men nu er du igang.

Advareles: Når du laver en YO Command og FX afvikler en Angular generator, kan der ofte ske en masse Error som dette. 
Error: Cannot find module 'rx'
at Function.Module._resolveFilename (module.js:336:15) osv.
Det er oftes at der mangler pakker eller det ikke er de rigtige versioner, der er ikke andet at gøre end at køre npm install -g og så alt det du mangler. Google er din ven. 

Yoman Tips
 Lav en ny kotroller skriv: yo angular:controller myCtrl
Lav et nyt View skriv: yo angular:view myView

Atom Fix.
Åben filen keymap.cson og tilføj følgende linje i bunden af filen.
'.platform-win32 .editor': 'ctrl-alt-[': 'unset!'
 'ctrl-alt-q': 'unset!'

Skriv endelig til mig, hvis du har nogen gode ideer.

Ingen kommentarer:

Send en kommentar