从安装angular-cli,到使用angular-cli建立第一个项目


最近在学习angular2,由于国内想要安装angular-cli的环境需要翻墙,在没有梯子的情况下,翻墙显得非常的蛋疼,自己也在坑里翻滚,挣扎,还好还是摸出了一条路

以下是windows 10环境下安装angular-cli的过程,并且在安装完成之后,使用angular-cli建立一个angular2的项目目录

1、在node.js的官网下载node.js的安装文件

最好下载的版本是windows系统(msi)64位这个,安装简单,自动装好node和npm

安装完成后使用命令提示符键入node -v查看node版本,最好是使用管理员模式

键入npm -v查看npm的版本,其实也是为了检查你的node和npm是否安装成功

确认上面两个步骤可以查询到系统的版本号之后,设置淘宝镜像,有梯子的土豪当我没说

npm install -g cnpm --registry=https://registry.npm.taobao.org

经过几分钟的等待,安装好之后,使用cnpm安装angular-cli

cnpm install –g @angular/cli

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

npm uninstall -g angular-cli
npm cache clean 

在检查你全局的那些npm文件下还残留下图这两个文件,有的话也要删掉

接下来这一步,最好重启下机器,被坑过,连转好几次,都以为没安装成功,结果试了下重启,就是安装成功了的

重启机器后

使用命令提示符键入ng version查看angular-cli的版本同时检测是否安装成功

接下来是建立一个demo01的项目,因为是在国内的环境,所以构建第一个项目的时候,也是要借助cnpm

首先,在自已的文件夹内打开命令提示符,这样也方便项目的管理(我是在一个angular-cli的文件夹内打开命令提示符的)

1、ng new demo01 --skip-install

加 --skip-install的原因是直接跳过下载,在下一步使用cnpm来下载

这一步骤完成之后相对应的文件夹会出现以上目录,接着

cd demo01

cnpm install

等待cnpm下载完angular需要依赖的文件,接着最后一步,开启服务

ng serve

 

显示webpack:Compiled successfully之后,打开浏览器输入localhost:4200就可以运行新建的angular2项目了

然而,这只是开端,接下来才开始正式和angular2交锋!!!

angular-cli虽然简单方便,帮你搭建好所需环境,但简单方便的对立面是不灵活,多了很多我们可能不想用的包、文件,所以有能力搭建项目的,还是自己搭建吧


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM