01为什么要学Angular？

Angular.png

• 为什么要学Angular？

为什么有的人，明明精通Vue和React，还要坚持去学习Angular，因为公司需要，他无法抵制对知识的渴求。俗话说，行走江湖，技多不压身~~~

如果你已经有了Vue和React的基础，并且还会一丢丢TypeScript，那么你离精通Angualr只差关注博主了~~~

在Angular的学习过程中，会发现很多与其他框架的相似之处，例如：指令、双向数据绑定、路由、过滤器（管道符）等。（也不晓得到底谁借鉴得谁~~~）

除了这些，ng模块化比较大胆的引入了Java的一些东西（依赖注入），能够很容易的写出可复用的代码，对于敏捷开发的团队来说非常有帮助。如果你是一名后端的程序员转前端，Angular绝对是你入门的首选。

当然，它也不是没有缺点，比如，官方文档写得就不咋的。很多地方只写了API，连个demo都没有。其他技术上的对比，刚开始学习，说多了也可能体会不到。

• 来吧，【全局安装】一下

cnpm i -g @angular/cli
//如果安装错误
cnpm uninstall -g  @angular/cli 
npm cache clean

• 学完要记得【卸载】掉

1. npm uninstall -g @angular/cli 卸载之前的版本
2. npm cache verify 清理缓存，确保卸载干净
3. ng v //若显示类似command not found的信息，则说明卸载完成
4. npm install -g @angular/cli@9.1.0指定安装版本

• 查看安装版本

ng v //注意：没有v前面没有"-"

• 创建项目

默认使用npm安装，没有配置其他镜像源的话，建议使用命令2跳过node安装

ng new angulardemo1
//命令2
ng new angulardemo1 --skip-install

• cd到安装目录，运行项目

ng serve --open
//更改端口号
ng serve --port 4201
//简写也可以
ng s 

• VScode配置插件，提高开发效率

1. Debugger for Chrome
2. Angular Snippets
3. Chrome插件Augury
4. VsCode中的REST Client插件

VSCode插件下载多了之后，可以下载Settings Sync插件，在迁移的时候可以通过上传git来同步，用过之后，就知道有多爽了
参考链接

• 大致的文件目录

angular-content.png

1. browserslist浏览器兼容配置文件
2. angular.json项目配置
3. karma单元测试配置文件
4. package.json项目依赖等
5. package-lock.json其他依赖的依赖
6. tsconfig.json全局的ts配置
7. tsconfig.spec测试的ts配置
8. tslint.json类型验证

• 如果你想真机调试，必须要和手机处于同一局域网下

ifconfig查看电脑ip地址
ng serve --host 0.0.0.0
手机浏览器输入：http://"电脑ip":4200