ng-cli搭建angular项目框架

原文地址

　　https://www.jianshu.com/p/0a8f4b0f29b3

环境准备

　　如下步骤都不须要事先建立文件夹，只是环境的准备过程，只有到须要搭建项目的时候才须要建立文件夹用来存放项目文件。

一、安装NodeJs

　　NodeJs的安装步骤是很简单的，在网上下载一个一个nodeJs安装包，而后按照提示一步一步的安装。
　　NodeJs安装好以后会连带着安装一个npm，nodeJs的安装流程很简单，按着步骤一步一步下来便可。
　　安装完成以后在控制台上输入npm -v 以及 node -v若成功则会输出对应版本，而且已经将npm和node部署到了全局的环境变量。

　　

二、安装angulr-cli

方式一：ng-cli原生指令

npm install -g @angular/cli

方式二：该指令一样能够完成功能，可是会有一些奇怪的问题，好比ng eject的指令就不存在

npm install -g angular-cli

三、查看angular-cli版本，检查是否安装成功

ng -v

　　

搭建项目框架

四、新建项目

ng new Anuglar2Demo1 //以下图则是项目建立成功的样子

　

五、进入项目目录

cd Anuglar2Demo1

六、启动项目——执行ng serve命令

ng serve

七、访问项目

　　访问http://localhost:4200/

总结

　　以上的步骤都是我从网上各个博客中边差边写的，而且本地根据上述的步骤也实现了好几回的搭建简单的angular项目的框架。固然有时候也可能由于nodejs的版本或者ng-cli的版本问题致使安装的失败，这时候不要着急，能够尝试着将版本下降或者从新搭建一次环境。利用ng-cli搭建angular看起来高大上，可是要搭建一个简单基础的项目框架，根据我上面的操做基本可以实现，可是一个全面的更加优秀的框架仍是须要不断的完善才能够的。

最后

　　这个是我已经搭建好的angular项目框架，若是不想花时间去搭建的能够直接克隆我搭建好的就能够使用了。

　　关于angular一些的实例应用中的angular-demo-base

　　//项目克隆以后，须要执行如下命令才能够启动项目 npm install npm run start

参考网址

使用 angular-cli 建立 angular2 项目
使用webStrom建立angular2项目
使用cnpm搭建项目