# @bigbinary/neetoui-rn 中文文档

规范地址：https://npmcn.com/package/%40bigbinary/neetoui-rn/

版本：3\.10\.0
npm 元数据更新时间：2026-11-02T16:26:09.818Z
中文译文更新时间：2026-11-08T02:33:23.509Z
软件包许可：MIT

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40bigbinary/neetoui-rn
原文对照：https://npmcn.com/package/%40bigbinary/neetoui-rn/?lang=original
项目主页：https://github.com/neetozone/neeto-ui-rn#readme
源码仓库：https://github.com/neetozone/neeto-ui-rn

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：2.7 MB，365 个文件
- 模块格式：CommonJS
- TypeScript 类型：包内自带
- 运行依赖：5 个
- peer 依赖：react \>=19\.0\.0，react-native \>=0\.88，react-native-svg \>=15\.0\.0，@shopify/flash-list \>=2\.0\.0，@gorhom/bottom-sheet ^5\.2\.14，react-native-webview \>=13，react-native-worklets \>=0\.13，react-native-unistyles \>=3\.2\.0，react-native-reanimated \>=4\.7，react-native-nitro-modules \*，react-native-toast-message ^2\.0\.0，react-native-gesture-handler \>=3\.4，react-native-safe-area-context \>=4\.0\.0
- 首次发布：2021-11-10T15:34:04.004Z
- 最新版本发布：2026-11-02T16:26:09.616Z
- 近 30 天下载量：2265（2026-10-08 至 2026-11-06，npm 官方下载统计）
- 已发布版本数：326（近 12 个月 35 个）

## 中文简介

react Introduct — v3 (Unityles, TypeScript, New Architecture) 的 UI 组件库

## 安装

```sh
npm install @bigbinary/neetoui-rn
```

也可以使用：`pnpm add @bigbinary/neetoui-rn`、`yarn add @bigbinary/neetoui-rn`、`bun add @bigbinary/neetoui-rn`

## README

**必须UI -RN** 是驱动所有经验的库 [需要产品](https://neeto.com/) React 本地应用程序构建于 [大边形](https://www.bigbinary.com/)。 。 。 .

## 文档

故事书是文献: [https://neetoui-rn.onrender.com/ 互联网档案馆的存檔,存档日期2013-12-21](https://neetoui-rn.onrender.com/)

每个组件都有其源头旁边的故事 `Docs` 章节涵盖 开始和主题符号.

## 安装

```
yarn add @bigbinary/neetoui-rn @gorhom/bottom-sheet @shopify/flash-list react-native-edge-to-edge react-native-gesture-handler react-native-nitro-modules react-native-reanimated react-native-safe-area-context react-native-svg react-native-toast-message react-native-unistyles
```

导航到 iOS 文件夹并运行 :

```
pod install
```

> 所有本地组件将自动链接 .

### 欢乐

包件船没有翻译类型Script,所以消耗的应用程序必须让Jest 改变它,而不是跳过它作为一个依赖:

```js
// jest.config.js
transformIgnorePatterns: [
  "node_modules/(?!(@react-native|@bigbinary|@gorhom|@shopify|react-native|react-native-[^/]+)/)",
],
```

没有这个,第一个测试失败 `import` 带有语法错误.

## 开始

## 他们

主题通过Unistyles注册. 打电话 `configureNeetoUI` 从你的应用软件 进入点(`index.js`),在导入屏幕之前:

```js
import { configureNeetoUI } from "@bigbinary/neetoui-rn/unistyles";

configureNeetoUI();
```

图书馆既装有光又装有暗的主题 **将灯一接而来 默认** 它没有遵循设备的颜色方案。 一个没有的应用程序 为暗模式设计了自己的屏幕,但只遵循了一半:符号类表面 暗去时,从字面颜色画出的任何东西 都保持光线,它出现 作为暗背景的暗文本和暗状态栏 `dark-content` 边框样式.

一旦屏幕准备好,请选择:

```js
configureNeetoUI({ adaptiveThemes: true });
```

尽管导入了库根注册,但选择加入者仍受到尊重 首先默认,所以它工作从 `index.js` 无论单元评价如何 秩序。 秩序.

## 字体

`theme.fonts` 使用Inter( SIL 打开字体许可, 参见 `assets/licenses/Inter-OFL.txt`) (中文(简体) ). 链接应用程序的捆绑文件 `react-native.config.js`数字 :

```js
module.exports = {
  assets: ["./node_modules/@bigbinary/neetoui-rn/assets/fonts"],
};
```

然后运行 `npx react-native-asset`检查 `UIAppFonts` 内 `Info.plist` 财务报告和审定财务报表 `android/app/src/main/assets/fonts` 仅列出 `Inter-*.ttf` 文档.

从 3. x 升级, 将 SF Pro 捆绑: 重新运行 `npx react-native-asset` 这么说 `SFProText-*.ttf` 文件已取消链接, 任何 `font` 选项 `configureNeetoUI`,移动硬码样式 `"SFProText-*"` 名称改为 `theme.fonts`。 。 。 .

## 平板布局

平面由两相或三相平面平板壳所建. 壳本身, 其导航和任何持续宽度都留在应用程序中.

-   `useTabletLayout()` 返回时 `{ width, height, isTablet, isLandscape }`。 。 。 . `isTablet` 当窗口的短边至少是 `TABLET_MIN_SHORT_SIDE` (600dp),所以一个风景电话留在电话上 设置. `isTabletWindow({ width, height })` 用于外部的同一检查 a 构成部分.
-   `NavRail` 是图标栏: `links` (单位:千美元)`{ key, label, Icon, activeOn? }`, (中文(简体) ), `activeRoute`, (中文(简体) ), `onNavigate`附加时 `header` 财务报告和审定财务报表 `footer` 插槽 . `NavRailItem` 框架页脚槽; 给它 `onPress` 用于按钮,或将其关闭以包装 处理自己的新闻的内容.
-   `ResizeHandle` 将列拖到它的左边。 父拥有宽度 重新激活共享价值和大小 `Animated.View` 从它; 把手 电话 `onCommit` 宽度和宽度 `onReset` 在双管上。 过 `accessibilityValue` (单位:千美元)`{ min, max, now }`所以屏幕阅读器可以读取 宽;它们按20平方步调整. `clampListWidth` 内部保持宽度 `LIST_WIDTH_RANGE` 并且是一个工人.
-   `CenteredSheet` 电话屏幕显示为 `CENTERED_SHEET_WIDTH` 牌过 窗帘,有一个叫 `onClose`名称 `accessibilityLabel`。 。 。 .

常数 : `RAIL_WIDTH`, (中文(简体) ), `LIST_WIDTH_DEFAULT`, (中文(简体) ), `LIST_WIDTH_RANGE`, (中文(简体) ), `RESIZE_HANDLE_WIDTH`, (中文(简体) ), `CENTERED_SHEET_WIDTH`, (中文(简体) ), `TABLET_MIN_SHORT_SIDE`。 。 。 .

## 反应-内在-安全区域-文本

我们正在使用SafeRea View从 [`react-native-safe-area-context`](https://github.com/th3rdwave/react-native-safe-area-context) 在我们 `ParentView` 用于处理安全区域的组件。 遵循下面的指示 `SafeAreaProvider` 联 合 国 `ParentView` 对工作的组成部分.

### 安全区提供商

你应该加上 `SafeAreaProvider` 在您的应用根组件中。 你也许需要 在使用方式和路线根等其他地方添加 [`react-native-screens`](https://github.com/software-mansion/react-native-screens)。 。 。 .

注意供应商不应在 `View` 动画 `Animated` 或内部 `ScrollView` 因为它可以引起非常频繁的更新.

#### 示例

```js
import { SafeAreaProvider } from "react-native-safe-area-context";

function App() {
  return <SafeAreaProvider>...</SafeAreaProvider>;
}
```

## 发展

通过执行以下命令安装所有依赖 .

```
yarn
```

新组件进入 `src/components/<Name>/`,从 `src/index.ts`, (中文(简体) ), 并携带一个位于同一地点 `<Name>.stories.tsx` 加号 `__tests__/`。 。 。 .

| 任务 | 命令 |
| --- | --- |
| 故事书 (网易) | `yarn storybook` |
| 构建故事书 | `yarn build-storybook` |
| 测试 | `yarn test` |
| 类型 | `yarn typecheck` |
| 林特 | `yarn lint` |
| 安装设备 | 见 `example/` |

`yarn build-storybook` 将静态文件写入 `storybook-static/`。 。 。 .

## 自动发布给国家预防机制

需要UI- RN 版本得到补丁、自动加速度和自动发布到 npm 上 新承诺主要分支。 你可以去检查 `publish` github 工作流程 动作获取实时更新.

## 用 yalc 软件包管理器进行测试

在当地出版

```
yarn build && rm -rf ~/.yalc/packages && yalc publish --private
```

或者说

```
yarn yalc:publish
```

在任何应用程序中安装本地雅尔克版本的库.

```
rm -rf .yalc && yalc add @bigbinary/neetoui-rn  && rm -rf node_modules  && yarn
```

## 更多地了解对寄存器的贡献

[https://github.com/bigbinary/neeto-ui-rn/blob/main/CONTRIBUTING.md 互联网档案馆的存檔,存档日期2014-12-21](https://github.com/bigbinary/neeto-ui-rn/blob/main/CONTRIBUTING.md)

## 常见问题

### @bigbinary/neetoui-rn 是什么？

react Introduct — v3 \(Unityles, TypeScript, New Architecture\) 的 UI 组件库

### 如何安装 @bigbinary/neetoui-rn？

在项目目录运行 npm install @bigbinary/neetoui-rn，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：react（\>=19\.0\.0）、react-native（\>=0\.88）、react-native-svg（\>=15\.0\.0）、@shopify/flash-list（\>=2\.0\.0）、@gorhom/bottom-sheet（^5\.2\.14）、react-native-webview（\>=13）、react-native-worklets（\>=0\.13）、react-native-unistyles（\>=3\.2\.0）、react-native-reanimated（\>=4\.7）、react-native-nitro-modules（\*）、react-native-toast-message（^2\.0\.0）、react-native-gesture-handler（\>=3\.4）、react-native-safe-area-context（\>=4\.0\.0）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @bigbinary/neetoui-rn 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @bigbinary/neetoui-rn 支持 ESM 还是 CommonJS？

以 CommonJS 形式发布，可以直接 require\(\)；在 ES Module 项目中也可以用 import 引入（Node\.js 会把 module\.exports 作为默认导出）。

### @bigbinary/neetoui-rn 可以商用吗？

@bigbinary/neetoui-rn 使用 MIT 许可。宽松许可：允许商业使用、修改和再分发，通常只需在分发时保留原版权与许可声明。以上为概括，不构成法律意见，请以许可原文为准。

### @bigbinary/neetoui-rn 的下载量有多少？

根据 npm 官方下载统计，@bigbinary/neetoui-rn 在 2026/10/08 – 2026/11/06 这 30 天内被下载 2,265 次，日均约 76 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @bigbinary/neetoui-rn 还在维护吗？

最新版本 3\.10\.0 发布于 2026/11/03（5 天前）；至今共发布 326 个版本，其中过去 12 个月发布了 35 个；首次发布于 2021/11/10。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。