NutUI
UI 库活跃维护京东开源的轻量级移动端组件库,支持 Vue 2/Vue 3/React 多版本,适配小程序多端。
★ 6,507🕒 最近更新 2026-04
小程序UI框架UIUI设计
特性
- 京东风格
- 轻量级
- Vue/React双版本
- 多端适配
详细文档
NutUI 2
A light mobile Toolkit

English | 简体中文
Features
- New structure
- 50+ Reusable components
- Used by 40+ JD mobile projects
- Refer to JD APP 7.0 visual specification
- On-demand loading Support
- Detailed documents and examples
- Customize themes Support
- Multiple languages Support (Internationalization)
- TypeScript Support
- Vue Server-side Rendering Support(Vue SSR)
- Unit test blessing
- A Webpack-based build tool is available to quickly create a Vue project with this component library built in
If you want to use the 1.x version, please specify the version number when installing,such as:
npm i @nutui/nutui@1.3.2 -S
Environment Support
- Android 4.0+
- iOS 8.0+
- Support Vue Server-side Rendering
Version
You can also subscribe to: https://github.com/jdf2e/nutui/releases.atom for the notifications of stable releases。
Examples

Installation
Please refer to the NutUI offcial website for the details on how to use it
Links
- Feedback
- Change Logs
- Case collection
- On-demand plugins
- Template project command line tool(Gaea-cli)
- Contact us:nutui@jd.com
User Cases
NutUI has been put into use in our production environment and is widely used in developing countries at the same time.
实战开发指南
Taro 项目集成
npm install @nutui/nutui-taro
在 app.config.ts 中配置:
export default {
designWidth: 750,
// NutUI 需要 px 转 rpx
}
Vue3 项目集成
npm install @nutui/nutui
import { Button } from @nutui/nutui
import @nutui/nutui/dist/style.css
常见问题
-
Taro 中样式失效:确保
config/index.ts中配置了 NutUI 的px转换规则。 -
暗黑模式:NutUI 支持暗黑模式,通过 CSS 变量切换:
import @nutui/nutui/dist/dark-theme.css
- 按需加载:配合
unplugin-vue-components实现自动按需引入,减小打包体积。