Ant Design 6.0 正式发布

奈飞网 2 0

ant design v6 正式上线!

Ant Design 6.0 正式发布-第1张图片-奈飞网

本次版本更新聚焦于 技术底层的全面优化,致力于为 React 19 及后续版本提供更强的兼容性与性能支持(最低兼容提升至 React 18),同时进一步强化组件的语义化结构设计,并增强对 CSS 变量的原生支持。

与上一代 v5 相比,此次升级实现了 无缝迁移体验

  • 若你的项目已在使用 v5 版本,无需引入任何兼容包或 codemod 工具,可直接平滑升级至 v6。

  • v5 的主分支将迁移至 v5.x-stable,进入为期 1 年的维护阶段

    • 除非出现严重级别 Bug,v5 将不再接收功能层面的更新。

核心技术演进与关键变更

React 最低依赖升级至 18

v6 起正式要求 React 18 作为最低版本,彻底移除了对更早版本的兼容逻辑,避免多版本间 API 行为不一致的问题。我们仍推荐开发者使用最新的 React 19 以获得最优开发体验。

对于如 Modal.confirm 这类静态方法调用,现已无需额外兼容处理:

-- import '@ant-design/v5-patch-for-react-19';

? 构建产物启用 React Compiler

antd.jsantd.min.js 中已集成 React Compiler 支持,CJS/ESM 用户可根据需要自行启用。

? 全面采用纯 CSS Variables 样式体系

随着 IE 浏览器支持的全面终止,v6 中的 @ant-design/cssinjs 默认启用 纯 CSS Variables 模式

  • 主题切换更加高效,支持运行时动态换肤。
  • 多主题共享显著减少打包体积。
  • 支持零运行时样式生成,配合 @ant-design/static-style-extract 使用效果更佳:

<configprovider theme="{{" true="" zeroruntime:="">  <app></app></configprovider>

性能对比显示,zeroRuntime 模式表现最优(横轴为加载的主题数量):

Ant Design 6.0 正式发布-第2张图片-奈飞网

Ant Design 6.0 正式发布-第3张图片-奈飞网

Ant Design 6.0 正式发布-第4张图片-奈飞网 睿拓智能网站系统-网上商城

睿拓智能网站系统-网上商城1.0免费版软件大小:5M运行环境:asp+access本版本是永州睿拓信息专为电子商务入门级用户开发的网上电子商城系统,拥有产品发布,新闻发布,在线下单等全部功能,并且正式商用用户可在线提供多个模板更换,可实现一般网店交易所有功能,是中小企业和个人开展个人独立电子商务商城最佳的选择,以下为详细功能介绍:1.最新产品-提供最新产品发布管理修改,和最新产品订单查看2.推荐产

下载

可通过 useToken 获取完整的变量命名:

const App = () => {  const {    cssVar: { colorBgElevated },  } = theme.useToken();};

? 不再兼容 IE 浏览器

因采用 CSS Variables 方案,IE 兼容相关的 StyleProvider 已被完全移除。

? 所有组件完成语义化重构

v6 实现了 全部组件 的 DOM 结构语义化升级:

Ant Design 6.0 正式发布-第5张图片-奈飞网

  • Ant Design v6 tasks[#52115](javascript:;) (https://www.php.cn/link/62da0d73a9cbf74d99d3b7de9dfd183a)

Ant Design 6.0 正式发布-第6张图片-奈飞网

  • Support better customization with semantic classNames/styles[#54995](javascript:;) (https://www.php.cn/link/a9b87f5958fd8913eee9e58de86596b6)
  • API 设计采用逻辑方位(如 start/end),天然支持 RTL 布局。
  • 内部结构可通过 ConfigProvider 的 classNames 与 styles 统一配置。
    • 支持函数式动态生成语义类名:

const btnClassNames: ButtonProps['classNames'] = ({ props }) => {  switch (props.type) {    case 'primary':      return { ... };    default:      return { ... };  }};<configprovider btnclassnames="" button="{{" classnames:="">  <app></app></configprovider>

卖萌图标按钮

}>  Ant Design

Ant Design 6.0 正式发布-第7张图片-奈飞网

极客风格卡片

<card body:="" border-green-500="" classnames="{{" header:="" overflow-visible="" root:="" rounded-none="" text-green-500="" title:="">  Ant Design loves you!~ (=^・ω・^)</card>

Ant Design 6.0 正式发布-第8张图片-奈飞网

? 清理 v4 遗留废弃 API

v6 移除了所有在 v4 被标记废弃、v5 保留兼容的接口:

  • findDOMNode 相关兼容逻辑已被删除。
  • List、Dropdown.Button、BackTop 等组件从文档中移除但代码仍保留兼容。
  • React 18 兼容补丁已移除(原生支持 18+)。
  • 统一 API 命名规范,保持与 v5 接口完全兼容。

详细说明请查看:https://www.php.cn/link/2528242a42d15858f02248a1fd475db9
下载地址:https://www.php.cn/link/672cda1d1b10d66f600e6cadcf102b87

源码地址:点击下载

标签: 软件 react

抱歉,评论功能暂时关闭!