Ngx-Vant 重大更新：全面升级至 Angular 21很高兴地宣布，Ngx-Vant 组件库已经完成了一次重大版本

很高兴地宣布，Ngx-Vant 组件库已经完成了一次重大版本升级！作为 Vant 在 Angular 生态的实现，我们始终致力于为开发者提供高质量、易用的移动端 UI 组件。

经过持续的开发和优化，Ngx-Vant 现已全面支持 Angular 21、TypeScript 5.9 和 RxJS 7，这标志着项目进入了一个全新的发展阶段。

升级概览

本次升级是一次跨越式的版本迁移，主要包括以下核心依赖的更新：

核心框架升级

Angular: 14.2.2 → 21.2.1（跨越 7 个大版本）
TypeScript: 4.8.3 → 5.9.2
RxJS: 6.6.0 → 7.8.2
Zone.js: 0.11.4 → 0.16.0

构建工具升级

Angular CLI: 14.2.2 → 21.2.0
ng-packagr: 14.2.1 → 21.2.0

为什么要升级？

1. 性能提升

Angular 21 带来了显著的性能改进，包括更快的编译速度、更小的包体积和更优的运行时性能。

2. 新特性支持

更强大的类型推断能力（TypeScript 5.9）
更好的响应式编程体验（RxJS 7）
改进的开发者工具和调试体验

3. 长期维护

跟进最新版本意味着更好的社区支持、更及时的安全更新和更长的维护周期。

主要变更

组件架构调整

Angular 21 默认启用了 Standalone 组件模式。为了保持向后兼容，我们为所有组件、指令和管道添加了 standalone: false 配置：

@Component({
  standalone: false,
  selector: 'van-button',
  templateUrl: './button.component.html'
})
export class ButtonComponent { }

API 更新

highlight.js

// 旧版本
import * as hljs from 'highlight.js';
hljs.highlightBlock(element);

// 新版本
import hljs from 'highlight.js';
hljs.highlightElement(element);

TypeScript 类型增强

更严格的类型检查确保了代码的健壮性：

// 添加了显式类型转换
this.scrollable = this.allTabs.length > Number(value);

构建配置优化

移除了已废弃的 ngcc 后处理脚本
更新了 tsconfig.json 配置以支持 ES2022
优化了模块解析策略（moduleResolution: "bundler"）

如何升级

如果你正在使用旧版本的 Ngx-Vant，可以按照以下步骤升级：

1. 更新依赖

npm install ngx-vant@latest

2. 升级 Angular

确保你的项目使用 Angular 21+：

ng update @angular/core@21 @angular/cli@21

3. 版本要求

Angular: 21.0.0+
TypeScript: 5.9.0+
RxJS: 7.4.0+

兼容性说明

浏览器支持

现代浏览器（Chrome、Firefox、Safari、Edge）
Android 4.0+
iOS 8.0+

破坏性变更

本次升级包含破坏性变更，主要体现在：

需要 Angular 21+ 环境
需要 TypeScript 5.9+ 支持
RxJS 6 的部分 API 已废弃

项目现状

组件覆盖

Ngx-Vant 目前提供了 60+ 个高质量组件，覆盖移动端开发的各类场景：

基础组件：Button、Cell、Icon、Image 等
表单组件：Field、Radio、Checkbox、Switch 等
反馈组件：Toast、Dialog、Loading、Notify 等
展示组件：List、Grid、Swipe、Tab 等
导航组件：NavBar、Tabbar、Sidebar 等

特性支持

✅ 完善的中英文文档 ✅ 支持按需引入 ✅ 支持主题定制 ✅ 支持国际化 ✅ 完整的 TypeScript 类型定义 ✅ 单元测试覆盖

持续维护承诺

Ngx-Vant 将继续保持活跃的开发和维护状态。我们承诺：

🔄 定期更新：跟进 Angular 和相关依赖的最新版本
🐛 问题修复：及时响应和修复社区反馈的问题
📚 文档完善：持续改进文档和示例代码
🚀 新特性开发：根据社区需求添加新组件和功能

欢迎贡献

开源项目的发展离不开社区的支持和贡献。我们诚挚地邀请你参与到 Ngx-Vant 的建设中来！

如何参与

1. 报告问题

在使用过程中遇到任何问题，欢迎提交 Issue。

2. 贡献代码

Fork 项目仓库
创建特性分支
提交你的改动
发起 Pull Request

3. 完善文档

文档是项目的重要组成部分，欢迎帮助我们：

修正文档中的错误
补充使用示例
翻译文档内容

4. 分享经验

撰写使用教程
分享最佳实践
在社区中推广 Ngx-Vant

开发指南

详细的开发指南请参考：贡献指南

技术栈

Ngx-Vant 基于以下技术构建：

Angular 21: 现代化的前端框架
TypeScript 5.9: 类型安全的 JavaScript 超集
RxJS 7: 强大的响应式编程库
Less: CSS 预处理器
ng-packagr: Angular 库打包工具

致谢

感谢所有为 Ngx-Vant 做出贡献的开发者，以及一直支持和使用本项目的用户。正是因为有你们的支持，Ngx-Vant 才能不断进步和完善。

特别感谢 Vant 团队提供的优秀设计规范和组件实现参考。

未来规划

我们将继续优化和完善 Ngx-Vant，未来的计划包括：

🎨 支持更多主题定制选项
📱 优化移动端性能和体验
🧩 添加更多实用组件
🌍 完善国际化支持
📖 提供更多实战示例

结语

这次升级标志着 Ngx-Vant 进入了一个新的发展阶段。我们将继续秉承开源精神，为 Angular 社区提供优质的移动端组件库。

如果你觉得 Ngx-Vant 对你有帮助，欢迎给我们一个 ⭐️ Star，这将是对我们最大的鼓励！

让我们一起，让 Angular 移动端开发变得更加简单和高效！

Ngx-Vant 重大更新：全面升级至 Angular 21