angular cli 是便于angular开发的命令行接口,用于实现自动化开发工作。

# angular cli安装
npm install -g typescript #安装最新版typescript
npm install -g @angular/cli  #安装angular cli
ng version

# 用cli创建angualr应用
ng new my-app --option #my-app为应用程序名
--option可选项:
--skip-install:boolean #默认false,表示跳过 npm install
--skip-git:boolean     #默认false,是否初始化git仓库
--directory:string     #设置创建的目录名,默认为应用程序名
--prefix:string        #设置创建新组件时,组件选择器使用的前缀
--routing:booean       #默认false,是否新增带有路由信息模块并添加到根模块

#运行应用程序
cd my-app
ng serve

#创建新功能(组件,服务)到应用程序
ng generate class my-class
ng generate component my-component
ng generate directive my-directive
ng generate enum my-enum
ng generate module my-module
ng generate pip my-pip
ng generate service my-service

npm install crypto-js
npm install @types/crypto-js --save-dev
之后在angualr里导入
import * as CryptoJS from 'crypto-js';

#惰性加载特性模块
ng new my-app --routing   #新建带根路由的应用
cd my-app
ng generate module my-module --routing #创建一个带路由的特性模块
ng generate component my-module/my-component #向特性模块中添加组件

#在顶层根路由配置路由指向对应的特性模块
const routers: Routes = [{path: 'hello', loadChildren:app/my-module/my-module.module#MyModule}]
@Ngmodule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})

#在特性模块的路由配置子路由
const routes: Routes = [{path: '', component: MyComponent}]
@Ngmodule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})

Angular2中使用的Typescript书写规范非常严格,默认启用no-trailing-whitespace,不遵守就会报错影响了写代码的效率,可在tslint.json中配置取消。

"no-trailing-whitespace": false #代码尾部空格检测,若为true则不允许每行代码后有空格,包括换行后产生空格
"on-line":["check-whitespace"]  #要求函数名等与大括号之间有空格,不取消比较好
"comment-foemat":["check-space"] #要求注释行的开头必须加一个空格
"whitespace":["check-sparator","...."]  #whitespace决定哪些必须要空格,check-separator表示初始化数组时相邻元素用","分割并之后加入空格

其他规范可见tslint.json设置成自己喜欢的风格