Note: For Spring 2021, we will use Angular 11, which requires Node.js version 12.2.0 or higher. (You may use Angular 10, which requires Node.js version 12.2.0 or higher) .
Alternatively, for Mac users, you may use a terminal and then run the following command (not recommended as it is known to cause some issues).
brew install node
node -v[if installed correctly, you should see the version of Node.js you installed]
The Node Package Manager (npm) is installed as a part of Node.js. To check if npm is available, use a terminal and type
npm -v[if installed correctly, you should see the version of npm you installed]
If the npm version number is not displayed and/or an error occurs, make sure to download a Node.js installer that includes npm. Your npm version should be 6.9.0 or higher.
If you already have node.js on your machine,
you may update all packages to a new major version by running the following command to
npm install -g npm-check-updates
The following describes steps needed to install Angular, assuming that no previous version of Angular is available on your machine. If you already have a previous version of Angular on your machine, you may refer to Angular update guide to update to the new version.
npm install -g @angular/cli
ng --version[you should see a screen similar to the following — showing Angular CLI with versions]
ng --version results in a message "bash /usr/bin/ng: No such file or directory in Angular",
it is possible that you install Angular (running the
npm install -g @angular/cli command) with root.
Try to remove angular-cli and then reinstall
sudo npm remove -g @angular/cli
sudo npm install -g @angular/cli
ng command still cannot be found, try setting alias.
Be sure to use the correct path where your
ng is installed.
(the paths where the
ng is installed can be found when running
sudo npm install -g @angular/cli command).
(Note: the sample image is from a Mac user.)
Suppose your node.js version is v14.6.0. To set an alias, use the following setting:
Note: while we are working on Angular 11, most of what we do work the same with Angular 10, 9, and 8.
Alternatively, PhpStorm also works well with Angular and TypeScript.
Do you have to use TypeScript? No. Although Angular is written in TypeScript, you do not have to use TypeScript to use Angular. Due to the time constraint, we are not going to talk about TypeScript in depth in this course. For more information, please refer to https://www.typescriptlang.org/.
ng newcommand to create a folder with the app name
ng new angular-example
Yto the question about generating a routing module
ng new angular-example results in "the schematic workflow failed" error,
it is possible that your system did not install npm properly because
some libraries may be missing.
As a result, your system has corrupted the npm and node module.
Try running the following steps:
npm cache clean --forceto clean the npm memory
npm uninstall -g @angular/clito uninstall Angular, then
npm install –g @angular/clior
npm install –g @angular/cli@latestto install Angular.
If you get the message "Port 4200 is already in use. Use '--port' to specify a different port", this means that you already have another service running on port 4200. If this is the case you can either
--portflag when running
ng serveto change the port:
ng serve --port 9001
Note that, on some machines, the domain
localhost may not work.
When you run
ng serve, you may see an IP address or a URL the server is running on.
Be sure to read the messages on your machine to find your exact development URL.
You should see a screen similar to the following