Angular之脚手架安装与创建项目（一）

node的安装

自行安装好node环境。官网地址：https://nodejs.org/zh-cn/

检查一下node的镜像源

npm config get registry。如果不是国内镜像的话，建议设置一下。npm默认是国外的镜像，下载时会慢很多。

设置淘宝镜像：

npm config set registry https://registry.npm.taobao.org/

安装Angular脚手架

先检查一下是否安装了脚手架

首先检查一下自己的电脑是否安装过Angular脚手架了。命令如下：

ng v

如果显示如下就说明没有安装过：

安装与升级

第一次装的话，采用如下命令：

npm i -g @angular/cli

如果需要升级的话，就使用如下命令：

npm i -g @angular/cli --force

• force代表的是强制覆盖。

在安装过程中会提示下图所示：

直接回车即可。如下图所示：

上图就为安装完毕。

检查是否安装成功

采用ng v，如下图所示：

上图代表安装成功了。

创建项目

ng new 项目名(包名)

创建项目时会提示一些问题要让选择。如下图所示：

在这里我创建的项目名为demo。静静等待创建项目的过程。如下图为创建项目成功：

运行项目

首先我们需要进行项目中cd demo。然后使用如下命令：

ng s -o

然后会自动打下浏览器http://localhost:4200。如下图所示：

项目中默认的端口号是4200，端口号是唯一的，即项目应该只能启动一次。

启动项目命令

启动项目：

ng serve。简写方式：ng s。

启动项目并在默认浏览器自动打开项目：

ng serve --open。简写方式：ng s -o。

模块

模块说明

• 每个应用至少有一个Angular模块，称为根模块。
• 它通常命名为AppModule。
• 根模块的作用：启动应用。
• 模块是独立的，封闭的。
• 模块之间的引用是通过导入和导出来完成的。

模块之间的引用图