前言：
本文适合Angular2的学者阅读；
时下web前端发展迅猛，新框架层出不穷，大家都知道三驾马车VueJS，Angular2，React。国内VueJS非常热门，百度热点趋势以1000%的涨幅在增加。Angular2在国外非常受欢迎，在国内的粉丝还非常少，文章不多，究其原因有这么几点主要是学习曲线陡峭，上手困难，（1）angular本身概念难懂，（2）使用typescript开发，用到很多es6特性；（3）配置太多，复杂，工程架构搭建上手难度大。本文为了解决项目搭建的问题，详细的一步步演示了如何搭建angular2项目；
为什么选择Angular CLI？
在开发中，搭建一个良好的前端架构非常重要，他对后续的开发，维护，团队协作，易读性具有重要意义；
生产中搭建Angular2的前端架构一般有三种选择：
第一种是自己一点点的搭建，这种对开发者要求比较高，必须对框架具有很深入的理解和很丰富的使用经验，否则搭建起来会遇到非常多的问题；
第二种是直接使用Angular2 seed，一些国外优秀程序员在github上已经贡献了，非常感激！我本人也站在前人的基础上加上了一些自己的内容，构建了一套脚手架，初学者们可以拿来即用，后面不断的去理解其中原委。hotshots-angular2-webpack-seed；这里面用刀了懒加载，webpack code splitting，涵盖angular2的很多知识点；
第三种就是本文要讲的使用angular2提供的Angular CLI来快速搭建，他本质也是使用了webpack来编译，打包，压缩等构建的事情，适合想用webpack的特性又不想学习webpack那些复杂的配置的开发者；
利弊：使用Angular CLI可以很快，很简单的构建angular2项目，只要掌握几行命令就能构建出前端架构的最佳实践，让人惊叹！不好的一面，简单的东西就意味着不灵活，如果你想高可控的配置你的项目，还是建议选择第二种方案；在本文写的这个时间（2016-12-2），Angular CLI还处于beta阶段，还只能用来自娱自乐，还不能用在生产中；
AngularCLI主要特性
1 Angular CLI 可以快速搭建框架，创建module，service，class，directive等；
2 具有webpack的功能，代码分割（code splitting），按需加载；
3 代码打包压缩；
4 模块测试，端到端测试；
5 热部署，有改动立即重新编译，不用刷新浏览器；而且速度很快
6 有开发环境，测试环境，生产环境的配置，不用自己操心；
7 sass，less的预编译Angular CLI都会自动识别后缀来编译；
8 typescript的配置，Angular CLI在创建应用时都可以自己配置；
9 在创建好的工程也可以做一些个性化的配置，webpack的具体配置还不支持，未来可能会增加；
10 Angular CLI创建的工程结构是最佳实践，生产可用；
开始搭建，基础工具的安装：
你需要安装NodeJS 8.7.0以上版本,NPM 3.0以上版本；WebStorm 11；
安装 Angular CLI
windows： npm install -g angular-cli
键入，ng -v可以看到以下界面
macOS: sudo npm install -g angular-cli
创建新项目：ng new 项目名称 --style=scss ngbootstrap要求使用scss
依赖bootstrap框架 npm install ngx-bootstrap --save
网友评论