angular2快速搭建本地开发环境

在过去的一年里，做项目都是用的angular1，后来陆陆续续angular2、angular4、angular5都出来了，这两天我们前端老大说要把项目改成angular2的，其实我还是挺兴奋的，能学一下这个神秘的angular2，号称跟angular1毫无关系，于是就开始上官网，查资料，写demo，下面贴上学习angular2的中文学习地址

https://www.angular.cn/

这里面有快速上手和一个编辑英雄指南的教程，我写这个教程写了有三遍，记得以前写过一遍（项目没要求的时候自己学着玩的），写到一半，实在看不懂，就放弃了，后来要自学（项目开始又要求了），又按部就班的按照官网写这个英雄指南，这次比上次认真一些，但是写到路由的时候，一脸懵逼，完全不知道在说啥，而且各种组件各种模块都给我整懵了，于是我先把他放下，去简单的浏览和学习了一下ES6的语法，然后马上去简单学习了一下TypeScript的语法和用法，又开始投入到angular2中来，这次终于能大致看懂了，也搞懂了angular2的大体架构，也把英雄指南完整的写了下来，想想真的不容易，在这里，我说说如何快速搭建开发环境

首先下载《快速上手种子》，去官网点击那个蓝色链接就能下载，如果懒得去，我在这里贴一下下载链接

https://github.com/angular/quickstart/archive/master.zip

把地址输入到浏览器地址栏中，回车就自动下载了，下载下来后解压到你的项目中去

搭建环境之前你要检查你电脑上是否下载了nodejs，因为要用到nodejs的npm安装必须的包，假设你已经安装了nodejs

接下来进入到quickstart-master目录中，是下面的样子

现在我们把多余的没用的文件给删掉，用以下指令即可

OS/X (bash) 命令：

xargs rm -rf < non-essential-files.osx.txt
rm src/app/*.spec*.ts
rm non-essential-files.osx.txt

Windows 命令：

for /f %i in (non-essential-files.txt) do del %i /F /S /Q
rd .git /s /q
rd e2e /s /q

以上指令分别输入一次，就可删除多余文件，我的是windows系统，所以用下面的指令
删除之后是这个样子的

是不是干净许多了
下面利用nodejs的npm下载需要的包


它会自动下载包

下载后的样子是这个样子的

有一个配置文件

这个是ts转js必需的配置文件，里面有个

然后执行下面的指令

npm start

它会自动打开浏览器，并显示demo里面的东西，并且修改文件后会自动刷新，很方便

好了，快速搭建本地环境就完成了！！！！