windows angular环境搭建

一、安装node.js

1.node.js简介

简单的说 Node.js 就是运行在服务端的 JavaScript。

Node.js是一个基于 Chrome V8 引擎的 JavaScript 运行环境；

Node.js使用一个事件驱动、非阻塞式 I/O 的模型，使其轻量且高效；

Node.js的软件包生态系统npm是全球最大的开源库生态系统。

2.安装node.js

2.1. Node.js 下载

官网：Download | Node.js

 2.2.node.js安装

点击安装文件，下一步，下一步直到完成。

测试安装结果，运行CMD，分别输入node -v 和 npm -v 分别查看node和npm的版本号

*npm随安装程序自动安装

2.3.配置npm安装全局模块的路径和缓存的路径

在node.js安装目录下新建两个文件夹 node_global和node_cache

然后执行如下两个命令

npm config set prefix "D:\Program Files\nodejs\node_global"

npm config set cache "D:\Program Files\nodejs\node_cache"

2.4 设置npm镜像

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

2.5 查看npm配置

执行命令npm config list

2.6 设置环境变量

环境变量” -> “系统变量”：新建一个变量名为 “NODE_PATH”， 值为“D:\Program Files\nodejs\node_global\node_module”

环境变量” -> “用户变量”：编辑用户变量里的Path，将相应npm的路径（“C:\Users\用户名\AppData\Roaming\npm”）改为：“D:\Program Files\nodejs\node_global”

出错一：执行npm命令时，提示‘npm’不是内部或外部命令，也不是可运行的程序
或批处理文件。因为环境变量配置问题

解决办法：在系统环境变量中，找到path 添加node.exe的路径。然后以系统管理员身份运行cmd，执行npm -v，可看到npm版本号，则配置成功。

二、安装angular CLI

1.angular/cli简介

angular脚手架，可以自动生成angular项目，并自带

2.安装angular/cli

执行安装命令：npm install -g @angular/cli

安装完成后，关闭cmd，重新以系统管理员身份运行cmd，执行ng version (简写：ng v)，查看angular版本

三、创建angular项目

进入到要存放项目的文件夹，选中文件目录，输入cmd，回车，进入cmd

执行命令： ng new ngpro   简写 ng n ngpro

在文件夹中会生成ngpro文件夹，这就是angular项目的文件夹。

用visual studio打开文件夹，可以看到项目中所有文件夹。

在cmd中执行 cd ngpro 进入项目文件，

执行 ng serve --open（简写  ng s -o）启动项目，serve：编译，--open：自动打开网页。