1.集成开发环境
搭建开发环境是一件很麻烦的事情，请大家一定要根据我讲的这个方法来搭建这个环境。
方法一：Angular-cli（内核是webpack）
方法二：Webpack
Angular-CLI 是 Google Angular 核心团队提供的开发工具，集成了大量的 NodeJS 模块，例如：webpack，karma，asmine，typescript 编译器等。只要一条命令就能帮你自动创建项目的目录结构、自动帮你生成 Component 骨架代码并自动添加依赖、自动热加载代码、对 AngularMaterial2 组件库提供了内置支持等等，不用再一个一个去配了。
2.安装流程
安装node.js。在cmd中输入命令nod -v查看版本（注意有的模块要与之对应的版本才能兼容）
node.js有自己的包管理器npm。由于某种神奇的原因，都懂得。有些模块比如node-sass会被墙掉。没办法安装，那怎么办呢？
有个东西叫cnpm，是淘宝的人提供的一个npm的镜像。每10分钟就和官方版本同步一次。服务器是在国内的，不用担心速度和被墙的问题。
>通过这条命令安装cnpm：
npm install -g cnpm
-g是global装在全局空间，路径是C:\Users\ksqb0\AppData\Roaming\npm
3.安装angular/cli
输入cnpm install -g @angular/cli。如果要更新cli的版本，卸载npm uninstall -g @angular/cli，再重新安装。
输入ng查看是否安装成功，它会告诉你很多命令的用法。ng version查看版本。
通过CLI，你可以创建、开发、测试、构建项目，而不需要额外的依赖。它封装了实现细节，如果是新手，你完全不需要懂Webpack，也不需要自己写构建脚本。
4.启动项目
选择指定路径创建新项目ng new MyProject。创建完之后它会自动生成目录结构，根组件，package.json里的依赖的模块。
cd到项目目录，cnpm install。cnpm装的包它是会读到目录下的package.json，所以不用-g，所依赖的包装在项目目录node_modules的文件夹里。
输入ng serve启动。这样在4200端口就有一个轻量级开发状态的http serve。打开浏览器输入localhost:4200打开
5.常见问题
为什么用cnpm安装？
原生npm的安装需要你的机器有python的环境,然后可能依赖于Windows API。node-sass的包被墙。node-gyp编译错误等一些大堆的问题。
关于目录结构
命令行工具是按照一定的规则生成文件和目录，如果改变文件的位置或重命名文件，有可能导致其他的功能失效。除非你明确的知道你要干什么，否则就不要改这些文件。
6.扩展思考
项目目录每一层都生成了什么：
e2e：端到端的测试目录
karma.conf.js：单元测试执行器
src：代码目录
angular-cli.json：这是angular命令行工具的配置文件
package.json：npm的配置文件，列明了当前应用所使用到的第三方依赖包。
src目录：
app：包含项目的组件和模块
assets：存放静态资源，比如图片
environment：环境配置文件
index.html：根html
main.ts：脚本执行的入口点，通过这个文件启动项目
polyfills.ts：导入一些必要的库，用来兼容老版本浏览器
style.css：全局样式
app目录：一个angular程序需要一个模块和一个组件
app.component.ts：组件，整个应用的基础
app.module.ts：模块