Angular安装步骤及问题解决

安装过angular的胖友一定经历过使用npm安装angular时，无数次的安装卸载还总是报错，偏偏npm安装还贼慢，那个郁闷与无奈。这里分享下本人的解决方法，希望可以帮助到有需要的人。

一、先决条件

在开始之前，请确保你的开发环境已经包含了 Node.js® 和 npm 包管理器。Angular 需要 Node.js 的 8.x 或 10.x 版本。

1、要想检查你的版本，请在终端/控制台窗口中运行 node -v 命令。

2、要想安装 Node.js，请访问 nodejs.org。

npm全名node package manager，是nodejs的包管理器，用于node的插件管理，包括安装、卸载、管理依赖等。由于npm安装插件是从国外服务器下载，受网络的影响比较大，导致使用npm安装angular时非常慢，可能会出现异常，因此推荐使用淘宝镜像cnpm。cnpm是一个完整 npmjs.org 镜像，你可以用此代替官方版本。

二、安装步骤

2.1 安装cnpm

在安装cnpm之前，建议配置下npm的全局模块的存放路径以及cache的路径。默认路径为C:\Users\用户名\AppData\Roaming\npm和C:\Users\用户名\AppData\Roaming\npm-cache。笔者nodejs的安装路径为C:\Program Files\nodejs，此处选择将其放在该目录下，在控制台执行如下命令。

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

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

执行完成后可以在文件夹中看到对应的文件夹，如下：

完成以上操作后，将C:\Program Files\nodejs\node_global 添加到系统环境变量Path中。

安装淘宝镜像cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org

执行cnpm -v出现如下提示表示安装成功。

2.2 安装angular

cnpm install -g @angular/cli

cnpm install @angular/cli

安装完angular，执行npm install -g rxjs-tslint安装tslint。执行ng --version可以查看angular的版本。

2.3 卸载angular

卸载已安装的angular

cnpm uninstall -g @angular/cli

cnpm uninstall @angular/cli

npm cache clean

若出现无法卸载，强制执行npm cache verify --force，卸载完成后使用ng --version确认是否卸载成功。

卸载已安装的cnpm

npm uninstall cnpm -g

2.4 安装指定版本angular

cnpm install @angular/cli@latest  安装最新版本angular

cnpm install @angular/[email protected] 安装7.2.1版本angular

三、问题

3.1 Error: Cannot find module 'node-sass'

执行cnpm install node-sass --save-dev，安装node-sass模块即可解决。

3.2 使用cnpm安装模块，同时使用npm安装模块报错

建议只使用以上其中一种来进行模块的安装，否则可能出现错误。本文所有操作都是基于cnpm，你也可以使用npm来进行安装。

【参考资料】

Angular中文社区

Angular5升级至Angular7