Angular2.0CLI安装指南

2017年03月12日 12:46:53

阅读数：2917

搭建AngularJS-CLI首先需要在windows上装node.js。安装node.js步骤：

 

1、http://download.csdn.net/download/huiling815/9709009     这是下载地址！！！！！！！！

 

2、然后一路next,默认是装到C盘的，我就装到了C盘

 

3、最后测试node是否安装成功，打开cmd,输入node -v,如果出现版本信息，证明安装成功，反之，亦然。

 

 

 

然后开始搭建AngularJS-CLI:

 

1、先添加淘宝的npm镜像（由于国内访问国外网站的速度实在是太慢了），由于我们只有要用到的一些东西，我

们采用以下的添加镜像方法

 

2、（windows 用户使用cmd，输入以下命令）

 

npmconfig set registryhttps://registry.npm.taobao.org

 

3、如果你之前安装失败过，最好在安装angular-cli之前先卸载干净，用以下   两句：

 

 npm uninstall -g angular-cli 

 npm cache clean

 

4、然后在cmd命令中输入：cnpm install -g angular-cli,开始安装AngularJS-CLI等待。。。。。。。。时间可能比较

 

长，耐心等待！

 

5、安装完毕后，试下ng -v 和ng help，有显示正确内容就成功了

 

6、通过cmd命令进入C:\Users\用户\AppData\Roaming\npm\node_modules\angular-cli重新安装 npm install rxjs     之

 

后我们就可以在全局使用ng命令了

 

7、首先到你的工作目录下建立Angular工程目录

 

   然后然后用命令行进入该目录，输入

 

   ng new projectName

 

然后脚手架会帮我们搭建初始环境，由于初始化的时候Angualr-cli会去初始化node-modules依赖，所以会比较慢；如果没有切换淘宝镜像，会 非常慢。

耐心等待！！！！！！！！！！！！！！！！！！！！！！！

 

最后安装成功！！！！！！！！！

 

 

就这样，最简单的angular2工程创建好了；

 

工程结构熟悉一下：angular-cli.json 是angular-cli的配置文件，测试配置文件karma.conf.js，typescript的lint配置文

 

件，端到端的测试配置文件protractor.conf.js，导入es6模块的配置文件polyfills.ts，angular工程的main.ts引导启动文

 

件，全局样式style.css，typescript配置文件ts.config.json;typescript的声明文件typings.d.ts,以及生成了最贱的的一个

 

angular组建 app.components相关的css，html，ts。这些配置都是angular2的生产项目中需要配置的文件，angular-

 

cli帮我们做了这么多事情，我们只用了一个命令；（这些玩意我也没看懂！！！！！！）

 

9、然后输入cd projectName

   命令行进入进入刚才的工程目录，输入

   ng serve

如果要是运行项目比较大的话可以用以下的命令

ng serve --prod --aot

 

10、浏览器输入 http://localhost:4200/就可以看到appworks！

 

因为默认的4200的端口，如果你需要换的话也是可以的package.json里面的

 

ng serve --host localhost --port 4201

 

 

OK！！！！！！！！！！！

 

最后如果你的项目要在eclipse中的tomact上运行

 

在cmd命令窗口输入 ng build --prod --aot

 

会生成一个dist文件，把这个文件导入eclipse中就可以了！

 

这个教程可能不全面。希望大家支持！！！！