Angular-使用Angular CLI快速搭建框架

什么是Angular？

是一款优秀的前端JS框架,AngularJS有着诸多特性，最为核心的是：MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等,AngularJS 是一个 JavaScript 框架。它是一个以 JavaScript 编写的库.

搭建前端框架一般的三种方法：

1.是自己一点点的搭建，这种对开发者要求比较高，必须对框架具有很深入的理解和很丰富的使用经验，否则搭建起来会遇到非常多的问题；

2.是直接使用Angular2 seed，一些国外优秀程序员在github上已经贡献了，非常感激！我本人也站在前人的基础上加上了一些自己的内容，构建了一套脚手架，初学者们可以拿来即用，后面不断的去理解其中原委。

3.使用angular2提供的Angular CLI来快速搭建，他本质也是使用了webpack来编译，打包，压缩等构建的事情，适合想用webpack的特性又不想学习webpack那些复杂的配置的开发者；

使用Angular CLI?利弊：

使用Angular CLI可以很快，很简单的构建angular2项目，只要掌握几行命令就能构建出前端架构的最佳实践，让人惊叹！不好的一面，简单的东西就意味着不灵活，如果你想高可控的配置你的项目，还是建议选择第二种方案

如何使用Angular CLI搭建框架？

1.下载node.js包 ，这样就能在cmd命令窗口中直接使用node或npm命令。

2.下载安装cnpm
在命令中直接输入：
npm install cnpm -g –registry=https://registry.npm.taobao.org

由于npm安装插件是从国外服务器下载，受网络影响很大，可能出现异常，继而淘宝团队生产一个完整的npmjs.org镜像，用cnpm代替npm,cnpm与nodejs的npm用法一致,只是在执行命令时，将npm改为cnpm

3.下载typescript 和 typings
在命令中输入：cnpm install –g typescript@2.2.2 typings
angular-cli是用typescript写的，所以需要安装typescript和typings

4.安装@angular/cli
在命令提示符中输入：cnpm install –g @angular/cli@1.0.0

5.创建项目
ng new angular-cli-project

angular2的基本文件已经创建，接下来就是在项目目录下下载项目所依赖的nodejs包

6.安装项目依赖的所有node.js包
转到项目目录下：
输入命令：cd angular-cli-project

安装node.js包
输入命令：cnpm install

工程结构如下:

7.启动服务
输入命令：ng serve，此时就可以看到启动的页面：