NutUI - 移动端组件库

为 Vue.js 移动端与微信小程序提供京东风格、轻量模块化的 UI 组件库，由京东设计与前端团队联合开发，帮助开发者高效搭建高性能移动应用界面。

核心特性

NutUI 围绕轻量、模块化、多端适配设计，兼顾开发效率与性能。

• 组件丰富：提供按钮、滑动菜单、模态框、表单等基础与业务组件
• 按需加载：支持 npm 或 yarn 单独引入组件，避免全量打包
• 样式定制：支持组件样式覆盖，便于匹配应用品牌风格
• 浏览器兼容：兼容主流移动端浏览器

快速上手

通过 npm 安装后，在 Vue 文件中按需引入组件即可使用，无需额外配置。

• 安装命令：npm install @nutui/nutui 或 yarn add @nutui/nutui
• 引入示例：import { Button, Cell } from '@nutui/nutui'
• 模板使用：<nut-button type="primary">主要按钮</nut-button>
• 注册方式：在 components 选项中声明组件名（如 'nut-button'）

适用场景

适合需要快速搭建京东风格移动端应用或小程序的团队，尤其适合已有 Vue.js 技术栈的项目。

• 电商类移动端应用：京东风格组件可直接复用，减少 UI 适配成本
• 微信小程序开发：组件库原生支持小程序语法，无需额外桥接
• 企业级中后台移动端：模块化设计便于按业务需求组合组件

常见问题

Q1：NutUI 是否支持 Vue 3？

A1：官网当前版本（https://nutui.jd.com/next/）为 Vue 3 版本，支持 Composition API 和按需引入。

Q2：NutUI 的组件能否在微信小程序中直接使用？

A2：可以。NutUI 官方支持微信小程序，组件语法与 Vue 移动端一致，无需额外适配。

Q3：如何按需引入 NutUI 组件以减少打包体积？

A3：通过 npm 安装 @nutui/nutui 后，在组件中直接 import 所需组件（如 import { Button } from '@nutui/nutui'），并在 components 中注册，构建工具会自动 tree-shaking 未使用的代码。

更多同类工具与网站,可在移动端分类继续挑选。

信息核实于 2026年7月,具体以官网为准。