angular版本更新与配置文件问题

本周写日志系统，需要我们自己初始化一个angular项目，在初始化过程中遇到很多问题

问题

版本问题

因为初始化时angular版本问题导致无法使用单元测试，然后尝试自己初始化一个angular项目，在初始化过程中遇到一些问题。
首先是我初始化的的时候因为我电脑上装的Angular-cli的版本是教程的版本11.0.7 这个版本单元测试虽然没有问题，但是在使用团队一些库的时候出现问题，因为智慧社区的版本是12.1.2，而教程的版本比较旧，有一些库在引入时会有问题。

解决办法

最开始想到的是有没有直接就可以对当前项目升级的方法，经过Google后，发现可以执行ng update 进行升级，但是那个博客写的不太清楚，我执行后发现没什么效果，但是在博客中发现这样一句话

然后尝试直接修改package中所有@angular的版本号，然后不报错，这种做法虽然感觉不太靠谱，但是能用。package.json 的 devDependencies 区列出的这些包可以帮助你在本机开发应用
之后就没有再管这个东西，但在写博客时又在官方文档中发现一个非常有用的工具
angular更新指南

这个工具会告诉你如何进行更新
ng update
通过运行以下命令，对核心框架和 CLI 的当前稳定版本执行基本更新

ng update @angular/cli @angular/core

要从一个主要版本更新到另一个，请使用以下格式

ng update @angular/cli@^ @angular/core@^

我们建议你始终更新到最新的补丁版本，因为它包含我们自最初的主版本以来发布的修复程序。例如，使用以下命令获取最新的 10.xx 版本并使用该版本进行更新。

ng update @angular/cli@^10 @angular/core@^10

总结

对于一个刚开始的项目最好的更新方法就是直接删了，切换angular-cli的版本，然后直接新建，如果时已经写了很多的则需要用上面提到的工具，根据给出的方法更新

angular 配置文件

一个angular 文件初始化时有如下文件

├── README.md         项目介绍文件，后期我们可以变更为对当前项目的介绍，比如项目完成了什么功能，在开发时需要什么
├── angular.json       Angular项目的配置文件
├── e2e                专门放集成测试文件的文件夹 
├── karma.conf.js      Karma对应的配置文件
├── node_modules       本项目依赖的其它npm包
├── package-lock.json  本项目依赖于其它包（库）的具体安装情况（版本、下载地址等）
├── package.json       本项目依赖于其它包（库）的情况
├── src                源代码文件夹
├── tsconfig.app.json  typescript相关的配置文件
├── tsconfig.json      typescript相关的配置文件
├── tsconfig.spec.json typescript测试相关的配置文件
└── tslint.json        语法校验配置文件

智慧社区主要修改的只有

TypeScript 配置

TypeScript 是 Angular 应用开发中使用的主语言。 它是 JavaScript 的“方言”之一，为类型安全和工具化而做了设计期支持。
浏览器不能直接执行 TypeScript。它得先用 tsc 编译器转译(transpile)成 JavaScript，而且编译器需要进行一些配置。
官方文档链接

package-lock.json

无论使用 npm 还是 yarn 安装的包，都会记录在
package.json文件中。
CLI 的 ng new 命令会在创建新的工作区的同时创建一个 package.json。 这个 package.json 用于此工作区中的所有项目，包括由 CLI 在创建工作区时创建的那个初始项目。
最初，这个 package.json 包括一组初始包，其中有些是 Angular 自身需要的，另一些是用来支持一些常见的应用场景。 随着应用的演化，你可能会往 package.json 中添加甚至移除一些包。
package.json 文件中的包被分成了两组：
dependencies 是运行应用的基础，包括
Angular 包：Angular 的核心和可选模块，它们的包名以 @angular/ 开头。
支持包：那些 Angular 应用运行时必需的第三方库。
腻子脚本：腻子脚本负责抹平不同浏览器的 JavaScript 实现之间的差异。
devDependencies 只有在开发应用时才会用到。

tslint.json

利用 npm 安装的 TypeScript 语法检查器 (linter) 检测 TypeScript 代码并在你违反它的规则时提示你。
这个文件在智慧社区中并没有
在有这个文件的时候很多常用的语法都会报错。

总结

以前都是老师建好了项目，我们直接写组件，现在要我们自己从头开始一个项目，在最开始的时候会遇到很多问题，当然也理解了很多基本的东西