168 lines
6.4 KiB
Markdown
168 lines
6.4 KiB
Markdown
# 依赖说明文档
|
||
|
||
此文档列出项目当前在 `package.json` 中声明的依赖（含 `devDependencies`），说明用途与安装/更新建议。
|
||
|
||
**快速命令**
|
||
|
||
- 安装全部依赖（项目根目录）：
|
||
|
||
```bash
|
||
npm install
|
||
```
|
||
|
||
- 单独安装/升级某包到最新版：
|
||
|
||
```bash
|
||
npm install <package>@latest --save
|
||
```
|
||
|
||
- 升级所有可升级的依赖（谨慎）：
|
||
|
||
```bash
|
||
npm update
|
||
```
|
||
|
||
---
|
||
|
||
## 主要运行时依赖
|
||
|
||
- **@expo/vector-icons**: ^15.0.3 — Expo 常用图标库，封装自 Ionicons/FontAwesome 等。
|
||
- **@react-native-async-storage/async-storage**: ^2.2.0 — 持久化本地键值存储（替代已弃用的 AsyncStorage）。
|
||
- **@react-navigation/bottom-tabs**: ^7.4.0 — 底部标签导航（React Navigation）。
|
||
- **@react-navigation/drawer**: ^7.7.10 — 抽屉式侧边导航（React Navigation）。
|
||
- **@react-navigation/elements**: ^2.6.3 — React Navigation 的 UI 元素集合。
|
||
- **@react-navigation/native**: ^7.1.8 — React Navigation 核心库。
|
||
- **axios**: ^1.13.2 — HTTP 客户端，用于网络请求。
|
||
- **expo**: ~54.0.31 — Expo SDK 主包，注意与 `react-native` 版本的兼容性（使用 SDK 54 系列）。
|
||
- **expo-blur**: ^15.0.8 — 模糊效果组件。
|
||
- **expo-constants**: ~18.0.13 — Expo 常量（应用、设备信息）。
|
||
- **expo-dev-client**: ^6.0.20 — 用于自定义开发客户端（本地调试）。
|
||
- **expo-file-system**: ^19.0.21 — 文件读写与管理 API。
|
||
- **expo-font**: ~14.0.10 — 字体加载与管理。
|
||
- **expo-haptics**: ~15.0.8 — 触觉反馈（震动）接口。
|
||
- **expo-image**: ~3.0.11 — Expo 的图片组件（性能优化）。
|
||
- **expo-image-picker**: ^17.0.10 — 选择相册或摄像头图片/视频。
|
||
- **expo-intent-launcher**: ^13.0.8 — 在 Android 上启动原生 Intent。
|
||
- **expo-linear-gradient**: ^15.0.8 — 线性渐变背景组件。
|
||
- **expo-linking**: ~8.0.11 — 处理深度链接和 URL。
|
||
- **expo-router**: ~6.0.21 — 基于文件系统的路由（Expo Router）。
|
||
- **expo-splash-screen**: ~31.0.13 — 启动页控制与隐藏/显示 API。
|
||
- **expo-status-bar**: ~3.0.9 — 状态栏控制组件。
|
||
- **expo-symbols**: ~1.0.8 — 符号/资源工具（如需要）。
|
||
- **expo-system-ui**: ~6.0.9 — 控制系统 UI（状态栏/导航栏背景等）。
|
||
- **expo-updates**: ^29.0.16 — 管理 OTA 更新（用于发布后热更新）。
|
||
- **expo-web-browser**: ~15.0.10 — 在浏览器中打开链接的 API。
|
||
- **react**: 19.1.0 — React 主库。
|
||
- **react-dom**: 19.1.0 — Web 端的 React DOM（仅用于 web 构建）。
|
||
- **react-native**: 0.81.5 — React Native 核心库（由 Expo SDK 管理兼容性）。
|
||
- **react-native-gesture-handler**: ~2.28.0 — 手势处理库（React Navigation 依赖）。
|
||
- **react-native-reanimated**: ~4.1.1 — 高性能动画库。
|
||
- **react-native-safe-area-context**: ~5.6.0 — 处理安全区域（刘海、底部手势栏）。
|
||
- **react-native-screens**: ~4.16.0 — 屏幕优化，配合 React Navigation 使用。
|
||
- **react-native-toast-message**: ^2.3.3 — 全局 Toast 提示组件。
|
||
- **react-native-web**: ~0.21.0 — 将 RN 组件映射到 Web。
|
||
- **react-native-webview**: ^13.16.0 — 嵌入 WebView 组件。
|
||
- **react-native-worklets**: 0.5.1 — 与 Reanimated 工作函数相关（若项目使用 worklets）。
|
||
|
||
- **expo-localization**: ^14.1.0 — 获取设备语言/时区等本地化信息，常与 i18n 库配合使用。
|
||
- **i18next**: ^23.0.0 — 流行的国际化引擎，处理翻译资源和回退策略。
|
||
- **react-i18next**: ^13.0.0 — `i18next` 的 React 绑定，提供 hooks（`useTranslation`）和 Provider。
|
||
|
||
---
|
||
|
||
## 开发依赖
|
||
|
||
- **@types/react**: ~19.1.0 — TypeScript 的 React 类型定义。
|
||
- **eslint**: ^9.25.0 — 代码风格检查工具。
|
||
- **eslint-config-expo**: ~10.0.0 — Expo 推荐的 ESLint 配置。
|
||
- **typescript**: ~5.9.2 — TypeScript 语言支持。
|
||
|
||
---
|
||
|
||
## 国际化（i18n）
|
||
|
||
- **用途**：检测设备语言并根据翻译资源渲染对应文本。推荐在 App 根组件初始化并使用 Provider 包裹应用。
|
||
- **推荐依赖**：`expo-localization`（检测系统语言）、`i18next` + `react-i18next`（翻译管理与 React 绑定）。
|
||
|
||
**安装（已执行）**
|
||
|
||
```bash
|
||
npm install expo-localization react-i18next i18next --save
|
||
```
|
||
|
||
**最小初始化示例**
|
||
|
||
在 `src/i18n/index.ts` 中（示例）：
|
||
|
||
```ts
|
||
import * as Localization from "expo-localization";
|
||
import i18n from "i18next";
|
||
import { initReactI18next } from "react-i18next";
|
||
|
||
i18n.use(initReactI18next).init({
|
||
compatibilityJSON: "v3",
|
||
lng: Localization.locale.split("-")[0],
|
||
fallbackLng: "en",
|
||
resources: {
|
||
en: { translation: { welcome: "Welcome" } },
|
||
zh: { translation: { welcome: "欢迎" } },
|
||
},
|
||
interpolation: { escapeValue: false },
|
||
});
|
||
|
||
export default i18n;
|
||
```
|
||
|
||
在组件中使用：
|
||
|
||
```tsx
|
||
import { useTranslation } from "react-i18next";
|
||
const { t } = useTranslation();
|
||
<Text>{t("welcome")}</Text>;
|
||
```
|
||
|
||
**提示**：若需用户切换语言，请把选择保存到 `@react-native-async-storage/async-storage`，初始化时优先读取该值并调用 `i18n.changeLanguage(lang)`。
|
||
|
||
---
|
||
|
||
## 兼容性与注意事项
|
||
|
||
- **Expo SDK**: 当前使用 `expo` 版本为 `~54.0.31`（SDK 54 系列）。不要随意升级 `react-native` 或 `expo` 到与 SDK 不兼容的版本。参阅官方兼容矩阵：https://docs.expo.dev/versions/latest/
|
||
|
||
- **expo-updates 与 OTA**: 如果使用 `expo-updates`，请按照官方文档配置发布和 runtime 版本以避免更新失败。
|
||
|
||
- **原生模块**: 部分包（例如 `react-native-webview`, `@react-native-async-storage/async-storage`）在 bare workflow 或自定义 dev-client 时需要正确配置原生端（但在 managed Expo workflow 下通常可直接使用由 Expo 提供的托管版本）。
|
||
|
||
- **动画与 Reanimated**: `react-native-reanimated` 版本与 Babel 插件需要配套配置，确保在 `babel.config.js` 中正确启用 `react-native-reanimated/plugin`。
|
||
|
||
---
|
||
|
||
## 常见命令
|
||
|
||
- 安装新依赖（示例）:
|
||
|
||
```bash
|
||
npm install axios@latest --save
|
||
```
|
||
|
||
- 安装开发依赖（示例）:
|
||
|
||
```bash
|
||
npm install -D typescript@latest
|
||
```
|
||
|
||
- 检查安全性并自动修复可用问题:
|
||
|
||
```bash
|
||
npm audit
|
||
npm audit fix
|
||
```
|
||
|
||
---
|
||
|
||
如果你希望我：
|
||
|
||
- 生成更详细的每个包的官方文档链接与使用示例，或
|
||
- 根据目标平台（managed / bare / web）给出兼容性调整建议，
|
||
请告诉我，我会继续补充。
|