Angular 安装和环境设置
一. 介绍
Angular 是一个基于 TypeScript 的开发平台，包含组件化框架、丰富的库和开发工具，适合构建可扩展的 web 应用程序。本文将总结过去 4~5 年收集的关于 Angular 安装的信息，分为以下几个部分：
-
A - Node.js：JavaScript 运行时 -
B - npm：节点包管理器 -
C - TypeScript：带可选类型的 JavaScript -
D - Angular：基于 TypeScript 的开发平台 -
E - Angular 安装 -
F - 与 Angular 相关的内容
二. A - Node.js：JavaScript 运行时
我们需要安装 Node.js 才能安装 TypeScript。
Node.js 是一个建立在 Chrome 的 V8 JavaScript 引擎上的 JavaScript 运行时。Node.js 是开源的跨平台 JavaScript 运行环境，可以在浏览器之外执行 JavaScript 代码。Node.js 允许开发者使用 JavaScript 编写命令行工具和进行服务器端脚本编写，从而在发送页面之前生成动态网页内容。因此，Node.js 实现了“JavaScript 无处不在”的理念，将 web 应用开发统一为一种编程语言，而不是在服务器端和客户端脚本中使用不同的语言。
Node.js 安装
-
下载链接：Node.js 官网 -
最新 LTS 版本：16.15.1（包含 npm 8.11.0） -
注意：请勿安装当前最新的功能版本，例如 v 18.3.0，因为这可能会导致某些错误。
三. B - npm：节点包管理器
npm 是全球最大的软件库（注册中心），包含超过 800,000 个代码包。npm 也是一个软件包管理器和安装器。
npm（Node Package Manager）的名称源于最初创建 npm 时作为 Node.js 的包管理器。
开放源代码的开发者使用 npm 共享软件，npm 免费使用，并随 Node.js 一起安装。
npm 文档
例如：
# 安装 TypeScript
npm install -g typescript # 将 TypeScript 安装到全局
# 安装 npm
npm install -g npm # 将 npm 安装到全局
# 更新 npm 到新版本
npm install npm@7.5.6 -g # 更新 npm
# 安装 Angular CLI
npm install -g @angular/cli # 将 Angular CLI 安装到全局
四. C - TypeScript：带可选类型的 JavaScript
TypeScript 是一个类型化的 JavaScript 超集，可以编译为纯 JavaScript。
TypeScript 是带可选类型的 JavaScript。TypeScript 是一种编译语言，而不是在运行时解释。TypeScript 编译器将 TypeScript 文件（.ts）编译为 JavaScript 文件（.js）。
TypeScript 是 Microsoft 拥有和维护的一种开源和面向对象的编程语言。TypeScript 是 JavaScript 的超集，包含 JavaScript 的所有元素，以及类、模块、接口和类型等组件。TypeScript 的主要特点是静态类型方法。
TypeScript 最早于 2012 年 10 月由 Microsoft 引入。
TypeScript 安装
TypeScript 可以通过 npm 包管理器安装：
npm install -g typescript # 将 TypeScript 安装到全局
-
-g代表它将在系统上全局安装，以便在任何项目中使用 TypeScript 编译器。
tsc -v # 检查 TypeScript 版本
五. D - Angular：基于 TypeScript 的开发平台
AngularJS 是一个基于 JavaScript 的开源前端 web 框架，主要由 Google 和一群社区成员维护，旨在解决开发单页应用程序时遇到的许多挑战。它通过提供一个客户端模型-视图-控制器（MVC）和模型-视图-视图模型（MVVM）架构的框架，简化了应用程序的开发和测试。
Angular（通常称为“Angular 2+”或“Angular v2 及以上”）是一个基于 TypeScript 的开源 web 应用程序框架，由 Google 的 Angular 团队和一群社区成员共同维护。Angular 是对原有 AngularJS 的完全重写。
六. E - Angular 安装
1. 安装 Angular CLI 和基本 Angular 命令
# 安装 Angular CLI
npm install -g @angular/cli # 全局安装 Angular CLI
# 创建新的工作区和初始应用
ng new my-first-project # 创建名为 my-first-project 的新项目
# 运行应用
cd my-first-project # 进入项目目录
ng serve -o # 启动应用并自动打开浏览器
2. 更新 Angular CLI 到最新版本
可以使用安装命令更新 Angular：
npm install -g @angular/cli@latest # 安装最新版本
也可以使用更新命令：
ng update @angular/cli @angular/core # 更新项目中的 Angular 版本
查看详情请访问 Angular 更新。
七. F - 与 Angular 相关的内容
1. 使用 npm 运行 Angular 应用
在项目根目录（包含 package.json 的目录）中运行：
npm install # 安装所有所需的 npm 包
npm start # 启动应用
2. Angular CLI
Angular CLI 是用于管理 Angular 本地环境和工作区的工具。对于 Angular CLI 工具，了解 TypeScript 是有帮助的，但并不是必需的。
长时间支持（LTS）发布状态可从 nodejs.org 下载。
要在本地运行 Angular，您需要在计算机上安装以下内容：
-
Node.js。运行 node -v检查 Node.js 的版本，运行npm -v检查 npm 的版本。
# 安装 Angular CLI
npm install -g @angular/cli # 全局安装 Angular CLI
使用 Angular CLI，您可以使用命令 ng 来创建新的工作区、新项目、在开发期间服务您的应用程序，或生成可分享或分发的构建版本。
3. 测试
测试 Node.js。要查看 Node.js 是否已安装，请打开 Windows 命令提示符、PowerShell 或类似的命令行工具，输入：
node -v # 检查 Node.js 版本
测试 npm。要查看 npm 是否已安装，请输入：
npm -v # 检查 npm 版本
创建一个测试文件并运行它。测试 Node.js 是否正常工作的简单方法是创建一个 JavaScript 文件，命名为 hello.js，并添加以下代码：
console.log('Node is installed!'); // 在控制台输出 Node is installed!
要运行代码，只需打开命令行程序，导航到保存该文件的文件夹并输入：
node hello.js # 运行 hello.js 文件
您应该看到输出 Node is installed!。
八. 总结
本文讨论了 Angular 的安装与设置过程，强调了 Node.js、npm 和 TypeScript 在这一过程中的重要性。通过按照以上步骤，可以顺利安装和配置 Angular 开发环境。