能否使用不同版本的Angular？本地指定项目版本的方法与最佳实践

实现步骤 #

1. 为目标项目安装本地Angular CLI 15 #

进入项目根目录，执行以下命令将Angular CLI 15安装为开发依赖：

# 使用npm
npm install @angular/cli@15 --save-dev

# 使用yarn
yarn add @angular/cli@15 --dev

注意：如果项目原本的Angular核心版本（@angular/core、@angular/common等）与15不匹配，需同步调整核心依赖版本，确保CLI版本与框架版本一致。可以用以下命令批量更新核心依赖：

npm install @angular/core@15 @angular/common@15 @angular/router@15 @angular/forms@15 --save

或者通过CLI的更新命令自动处理依赖兼容：

npm run ng update @angular/core@15 @angular/cli@15

2. 调用本地CLI而非全局版本 #

直接输入ng命令会默认使用全局的17版本，需通过以下方式调用本地15版本：

• 通过npm/yarn脚本：在项目的package.json中添加或修改scripts字段，将常用命令映射到本地CLI：

  "scripts": {
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "ng": "ng"
  }
  

  之后执行命令时，使用npm run <脚本名>，比如：

  npm run start  # 启动本地开发服务
  npm run build  # 构建项目
  npm run ng version  # 查看当前使用的CLI版本
  

• 通过npx直接调用：如果临时执行单个命令，可直接用npx指定本地版本：

  npx ng@15 serve
  

最佳实践 #

• 锁定依赖版本：确保项目的package-lock.json（npm）或yarn.lock（yarn）被提交到版本控制系统，团队成员安装依赖时会自动同步到相同版本，避免版本不一致引发的问题。
• 统一使用项目脚本：团队内统一通过npm run <脚本名>执行命令，不要直接使用全局ng命令操作项目，防止误引入不兼容的配置或依赖。
• 定期验证版本：执行npm run ng version确认当前使用的是项目本地的15版本，避免因全局版本干扰导致的意外问题。
• 隔离全局与本地环境：不要在该项目中使用全局CLI的生成、更新等命令，所有操作都通过本地CLI执行，保证项目依赖环境的独立性。
• 版本升级规范：后续若需升级项目Angular版本，只需更新本地@angular/cli及核心依赖版本，无需修改全局CLI，升级后通过ng update命令自动处理兼容调整。

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