Angular

1.环境搭建1.1 npm包管理1.1.1 npm是什么1.1.2 npm安装1.1.3 npm更新 1.2 搭建环境1.2.1 安装 Angular CLI1.2.2 创建新的工作空间和应用1.2.3 运行应用 2.package.json讲解2.1 package.json文件创建2.2 package.json内容 3.angular.json讲解4.node_modules讲解

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 npm@latest -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.jsonpackage.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.xdescription: 包的描述license: 默认是MITscripts: 指令键值对private: true（如果设置为true，无法通过npm publish发布代码）

3.angular.json讲解

4.node_modules讲解