创建Angular应用遇read-package-json弃用警告，求解决及替代创建方法

问题背景 #

创建新Angular应用时遇到以下npm警告：

npm warn deprecated read-package-json@7.0.1: This package is no longer supported. Please use @npmcli/package-json instead.

changed 237 packages in 39s

44 packages are looking for funding
  run `npm fund` for details

已执行的操作：

• 将Node.js更新至最新版本v20.13.1
• 执行npm install --save @npmcli/package-json更新package.json
• 尝试更换项目工作目录
• 多次重启电脑

一、解决read-package-json弃用警告的方法 #

这个警告来自项目的间接依赖，手动安装@npmcli/package-json无法直接解决，因为是上游依赖包仍在调用已弃用的read-package-json。可尝试以下步骤：

1. 清理npm缓存

   npm cache clean --force
   

2. 删除本地依赖文件
   • macOS/Linux：

     rm -rf node_modules package-lock.json
     

   • Windows：

     rmdir /s /q node_modules
     del package-lock.json
     

3. 更新Angular CLI到兼容Node.js 20的版本（Node.js 20要求Angular CLI 16及以上）

   npm install -g @angular/cli@latest
   

4. 重新创建Angular项目并安装依赖

   ng new your-project-name
   cd your-project-name
   npm install
   

5. 若警告仍存在，可暂时忽略——这是依赖包维护者需要更新的问题，不会影响项目正常运行。

二、除Angular CLI外创建Angular应用的方式 #

1. Vite + Angular模板 #

Vite提供快速构建体验，支持直接初始化Angular项目：

npm create vite@latest

执行后选择Angular或Angular + TypeScript模板即可。

2. Nx Workspace #

适合构建大型多项目Angular架构，支持代码共享与高效开发：

npx create-nx-workspace

按照引导选择Angular相关的项目类型即可。

3. 手动搭建（适合学习底层原理） #

从空项目开始手动配置，步骤包括：

• 初始化npm项目：npm init -y
• 安装Angular核心依赖：npm install @angular/core @angular/compiler @angular/platform-browser @angular/platform-browser-dynamic typescript @types/node
• 配置tsconfig.json、webpack.config.js等构建文件
• 创建根组件、启动文件并配置入口

这种方式较为繁琐，但能帮助理解Ang "复　Scott�浮机器人 同选项费单{ SPDX from stack exchange, author Sandesh Pawar

内容的提问来源于stack exchange，提问作者Sandesh Pawar