Angular8 开发环境搭建

  1. Angular 环境搭建

安装 angular 的计算机上面必须安装最新的 nodejs--注意安装 nodejs 稳定版本

 

安装 cnpm,npm 可能安装失败建议先用 npm 安装一下 cnpm 用淘宝镜像安装

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

 

使用 npm/cnpm 命令安装 angular/cli (只需要安装一次)

npm install -g @angular/cli 或者 cnpm install -g @angular/cli

 

2. Angular-CLI升级到最新版

## Angular-CLI升级到最新版

npm uninstall -g angular-cli

npm cache clean -f

npm install -g @angular/[email protected]

 

 

3.Angular 创建项目

  1. 打开命令行工具找到你要创建项目的目录
  2. 创建项目:ng new 项目名称。

如果要跳过 npm i 安装依赖包:ng new angulardemo --skip-install。 // angulardemo: 项目名称

Angular8 开发环境搭建

4.运行项目

cd angulardemo

ng serve –open

 

5.Angular环境搭建以及创建项目可能遇到的错误

1、npm 安装 angular/cli 失败。 解决方案:用 cnpm 安装

2、安装项目依赖 npm i 的时候失败。

解决方案 1:ctrl+c 结束项目,cd 到项目里面,用 cnpm i 安装依赖

解决方案 2:创建项目的时候 --skip-install

ng new my-app --skip-install

cd my-app

cnpm install    或者   yarn

 

3、创建项目后用 npm i 或者 cnpm i 后项目没法运行。

解决方案:用 yarn 替代 cnpm 和 npm

ng new 的时候阻止自动安装 ng 包,只创建 ng 目录:ng new my-app --skip-install

安装 yarn :npm install -g yarn 或者 cnpm install -g yarn

进入目录 my-app 使用 yarn 安装 ng 所依赖的包:yarn

注意:yarn 命令 等同于 npm install / cnpm install 使用 yarn 前提是先安装 yarn , 安装使用 cnpm install -g yarn 就可以安装

 

6.Angular 开发工具

Visual Studio Code 安装angular8开发插件:

Angular8 开发环境搭建

 

vscode设置中文请参考文章:将VSCode设置成中文语言环境.docx

7.Angular 调试工具

浏览器就行了,代码藏的比较深,在下图这个位置:

 

Angular8 开发环境搭建