Library next 阿里React企业级组件库

一、项目介绍

React 生态组件库很多，但要做到「既适合大型中后台、又有完整设计体系、还能在浏览器里直接引 CDN 用」并不容易。很多团队在做阿里系或国内中后台项目时，需要一个经过大规模实战打磨、文档完善、和 React 深度集成的中文友好组件库。
Fusion Next（@alifd/next）是阿里巴巴出品的企业级 React 组件库，沉淀了阿里中后台的设计与工程经验。它提供按钮、表单、表格、穿梭框、日期选择等大量组件，既支持 npm 模块化引入，也支持直接用 script / link 标签在浏览器里使用，并配套完善的中文文档与设计规范。

二、项目基本信息

三、核心优势

• 阿里出品：中后台实战打磨，设计体系完整
• React 原生：基于 React，组件 API 符合 React 习惯
• 双引入方式：npm 模块化或 CDN 直引都支持
• 文档完善：中文文档与设计规范齐全
• 主题定制：支持主题变量，便于品牌化

四、适用场景

适合用 React 构建中后台系统、企业应用与管理平台的团队，尤其是阿里技术栈或需要中文文档支持的项目。

五、安装教程

当前最新版本 latest。按下方命令安装：

npm install @alifd/next --save

常见报错：依赖缺失时先升级对应运行环境（Node、Python、.NET、Go、Java、Rust、Bun、JDK）；网络超时多为镜像或代理问题，可重试或换源；Docker 相关命令需已安装并启动 Docker 服务；涉及 API Key 的服务请提前在环境变量或配置文件中填好。

六、使用示例

下面是一段可直接参考的真实示例：

import '@alifd/next/dist/next.css';
import { Button, Input } from '@alifd/next';

function App() {
  return (
    <div>
      <Input placeholder="请输入" />
      <Button type="primary" onClick={() => alert('提交')}>
        提交
      </Button>
    </div>
  );
}

七、常见问题

问：需要什么 React 版本？答：基于 React 16+，react / react-dom 作为 peerDependencies 需自行安装。问：能用 CDN 吗？答：可以，直接引入 unpkg 上的 next.js / next.css。

八、总结

next 用清晰的设计，把把界面能力做成可复用组件这件事从重复劳动变成了可复用、可维护的工程能力。它不追求大而全，而是把核心痛点解决得足够扎实，这正是日常开发与团队落地时最需要的那种工具。如果你也在被同类问题困扰，不妨按上面的安装与使用步骤试一试，把它接进自己的工作流。