Angular环境搭建

Angular4 随笔（一）----环境搭建

 1.下载node.js

 　　第一步：在浏览器中搜索node.js官网(https://nodejs.org/zh-cn/),根据本身系统下载相应版本，下载完成之后，下一步-->下一步--> ....安装完毕；

   　　  第二步：打开命令行工具，输入node -v 检查版本号，以下图时，说明node已经安装成功

                        

　　　　注释：v8.11.3表明当前node.js版本号：v8.11.3

　　2.安装 angular-cli 命令工具

　　　　第一步：在命令行工具 输入 npm install -g @angular/cli 

　　　　第二步：在命令行工具输入 ng -v 检查 angular-cli 命令工具是否安装成功，以下图：说明已经安装成功

                         

 3.使用angular-cli

　　第一步：建立angular项目

　　　　　　在命令行工具输入 ng new demo01 (ng new 项目名称)，以下图：

　　　　　　　　

　　　　　　注释：若是在下载依赖时出现错误，能够在下载目录上找到demo01 ,删除node_modules 文件夹，在命令行工具上 输入：

　　　　　　　　cd demo01   (--进入angular 项目demo01下)

　　　　　　　　npm install   (或 cnpm install -- 从新安装angular 依赖包)  

　　第二步：运行angular项目

　　　　　　在命令行工具输入以下指令

　　　　　　　　cd demo01 （进入angular项目）

        　　　　　　ng serve    （编译angualr 项目）

 　　　　　  打开浏览器，输入 localhost:4200，以下图：

　　　　　　　　

　　第三步：经常使用指令

　　　　① 建立组件 

　　　　　　ng g component home  或

　　　　　 ng g component components/home

　　　　② 建立管道

　　　　　　ng g pipe mypipe  或

　　　　　 ng g pipe pipes/mypipe

　　　　 ③ 建立服务

　　　　　　ng g service loger  或

　　　　　　ng g service services/loger

　　　　 ④ 建立模块

　　　　　   ng g module mymodule 或

　　　　　ng g module modules/mymodule