码迷,mamicode.com
首页 > 其他好文 > 详细

Angular学习笔记(工具篇)----Angular CLI

时间:2017-12-25 13:28:57      阅读:335      评论:0      收藏:0      [点我收藏+]

标签:component   class   .com   cli   geo   inf   angular   ima   rod   

Angular CLI 的作用  

技术分享图片

首先安装npm 和node    详情:http://www.cnblogs.com/gorgeous/p/8074180.html

在安装    npm install -g @angular/cli

验证  

技术分享图片

 

 

创建Angular项目
ng new my-app

进入Angular项目
cd my-app

启动项目
ng serve


优化项目创建方法(优化点:npm速度较慢)

ng new my-app --skip-install
cd my-app
cnpm install
ng serve

Ng new 简介  多多阅读英文,不行就像我这样

ng help 查看

技术分享图片

技术分享图片

例如  常见的 ng version 

技术分享图片

 

 

Ng serve 简介(可以动态编译)
运行在不同的端口
ng serve --port 4201

 

Ng generate简介


创建一个组件
ng g component test

技术分享图片

上述更新的文件

技术分享图片

组件的基本用法(要有Angular5 的基础)

技术分享图片

成功

技术分享图片

 

创建一个服务
ng g service test

更多详细的  gitbub https://github.com/angular/angular-cli/wiki/generate


Ng test


Ng bulid打包 提升性能

技术分享图片

技术分享图片

ng build -prod 生产环境文件就更少了(自己实现报了个错  网友说 是cnpm原因,或者版本问题 下回解决就好 )

 

Angular学习笔记(工具篇)----Angular CLI

标签:component   class   .com   cli   geo   inf   angular   ima   rod   

原文地址:http://www.cnblogs.com/gorgeous/p/8108506.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!