angular4.0随笔——安装、目录结构及组件的创建

一.安装node,点击https://nodejs.org/en/download/进入node官网,选择对应系统的node进行下载安装,安装完成后,cmd输入node -v和npm -v查看版本信息。

二.全局安装angular cli脚手架

  1. npm 安装 npm install -g @angular/cli
  2. 淘宝镜像安装
    (1) npm install -g cnpm --registry=https://registry.npm.taobao.org
    (2)cnpm install -g @angular/cli

三.创建项目
1. 打开cmd找到你要创建项目的目录
2. 创建项目 ng new 项目名称 ng new my-app
3. 进入项目启动服务
angular4.0随笔——安装、目录结构及组件的创建

四.目录与结构分析
angular4.0随笔——安装、目录结构及组件的创建

五. 创建组件以及app.module.ts组件分析

  1. app.module.ts
    定义AppModule,这个根模块会告诉angular如何组装该应用。目前只声明了AppComponent。
    angular4.0随笔——安装、目录结构及组件的创建
  2. 自定义组件,在项目目录app下创建components文件夹,新创建的组件都放在components文件夹下,规范目录。
    创建组件命令ng g component components/header
    angular4.0随笔——安装、目录结构及组件的创建