1.环境搭建

1.1 npm包管理

• Angular、Angular CLI 以及 Angular 应用都要依赖 npm 包来实现很多特性和功能。要下载并安装 npm 包，你需要一个 npm 包管理器。

1.1.1 npm是什么

• npm是前端开发使用的包管理工具。npm的作用就是让我们把可复用的框架代码发布到一个地方供大家使用。

1.1.2 npm安装

• npm依赖于node.js,去官网（https://nodejs.org/en/download/）下载安装node.js，分别执行node -v，npm -v 查看安装版本号
  

1.1.3 npm更新

• node附带的npm可能不是最新的，执行命令更新npm(-g 全局安装)
  npm install [email protected] -g
  

1.2 搭建环境

1.2.1 安装 Angular CLI

• npm install -g @angular/cli
  

1.2.2 创建新的工作空间和应用

• 执行ng new project-name
  
• 输入y然后回车
  
• 选择自己要的stylesheet一般使用css或者scss(根据项目需要自己选择)然后回车
  
• 创建成功，此时在C:\Users\bayan\下出现project-name项目
  

1.2.3 运行应用

-cd project-name然后执行ng serve --o运行项目
ng serve --o等价于ng serve --open

• 在本地浏览器输入http://localhost:4200/就可以进去项目页面

2.package.json讲解

2.1 package.json文件创建

正常情况下，新建的angular项目会自动生成package.json文件

• package.json不存在时, npm init 可以自动创建package.json
• package.json存在, npm install 或者 npm install –save-dev 会自动将package.json中的模块安装到node-modules文件夹下

-执行npm init时可以会弹出很多属性，可以输入内容，也可以enter回车使用默认值，最后输入yes就会生成package.json。或者直接执行npm init --yes直接跳过输入，生成默认值的package.json文件。

2.2 package.json内容

• name: 包名，全部为小写，无空格，可以使用下划线或者横线
• version: 版本号x.x.x
• description: 包的描述
• license: 默认是MIT
• scripts: 指令键值对
• private: true（如果设置为true，无法通过npm publish发布代码）
  

3.angular.json讲解

4.node_modules讲解