Angular 从 12 更新至 17 (1) --- 初始点

A - 简介

本文旨在讨论 Angular 应用程序的初始升级过程，提供设置开发环境的详细步骤以及从 Git 存储库克隆和运行应用程序的方法。

B - 设置初始环境

对于 Angular 开发环境，我们通常需要以下组件：

• Node.js — JavaScript 运行时
• npm — Node 包管理器
• TypeScript — 具有可选类型的 JavaScript，编译为纯 JavaScript 的类型化超集
• Angular — 基于 TypeScript 构建的开发平台

这四者之间的逻辑关系如下：

• Angular 是一个基于 TypeScript 构建的开发平台。
• TypeScript 和 Angular 均通过 npm 安装。
• npm（最初是 Node Package Manager 的缩写）是 JavaScript 编程语言的包管理器。
• npm 与 Node.js 关联，需先安装 Node.js，然后使用 npm 安装 TypeScript 和 Angular。

Node.js 的安装

1. 下载：Node.js 官网
2. 安装：按照安装向导完成 Node.js 的安装。
3. 检查版本：

   node -v  # 检查 Node.js 版本
   npm -v   # 检查 npm 版本
   

安装 TypeScript

通过 npm 安装 TypeScript：

npm install -g typescript  # 全局安装 TypeScript

安装 Angular 最新版本

安装 Angular CLI：

npm install -g @angular/cli  # 全局安装 Angular CLI

安装 VS Code 作为编辑器

1. 下载并安装 VS Code。
2. 安装相关扩展，如 Nx Console。

C - 从 Git 存储库克隆应用程序

至此，我们已经设置好了开发环境，接下来克隆应用程序并运行。

C.1 - 从存储库获取代码

使用 Git 克隆代码：

git clone   # 替换  为实际的 Git 存储库地址

C.2 - 安装依赖库

通过运行以下命令安装所有依赖库：

npm install  # 安装项目所需的所有 npm 包

如果遇到依赖冲突，尝试：

npm install --legacy-peer-deps  # 忽略对等依赖冲突，安装依赖

笔记：

• --legacy-peer-deps：在存在对等依赖冲突时使用，允许旧的安装方式。
• --force：强制安装，覆盖现有文件，通常在解决冲突时使用。

C.3 - 运行应用程序

运行应用程序：

npm start  # 启动应用程序

如果收到错误，如：

错误：0308010C：数字信封例程::不支持

这通常是由于 Node.js 和 OpenSSL 版本之间的兼容性问题。解决方案可能是降级到 Node.js v16。

降级 Node.js 版本

可以通过以下命令降级 Node.js：

npm install -g n  # 安装 Node 版本管理工具 n
n 16  # 降级到 Node.js v16

成功降级后，重新运行应用程序：

npm start  # 再次启动应用程序

现在我们可以开始升级应用程序。