# @dotmind/react-use-pwa 中文文档

规范地址：https://npmcn.com/package/%40dotmind/react-use-pwa/

版本：1\.0\.4
npm 元数据更新时间：2022-04-05T05:28:58.428Z
中文译文更新时间：2026-11-12T20:54:49.552Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40dotmind/react-use-pwa
原文对照：https://npmcn.com/package/%40dotmind/react-use-pwa/?lang=original
项目主页：https://github.com/dotmind/react-use-pwa
源码仓库：https://github.com/dotmind/react-use-pwa

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

- 包体积（解压后）：11.8 kB，11 个文件
- 模块格式：CommonJS
- TypeScript 类型：包内自带
- 运行依赖：0 个
- 首次发布：2021-04-21T14:05:10.391Z
- 最新版本发布：2021-04-23T10:36:30.641Z
- 近 30 天下载量：5035（2026-10-13 至 2026-11-11，npm 官方下载统计）
- 已发布版本数：5（近 12 个月 0 个）

## 中文简介

快速安装进步 Web App 和更多 React shocks

## 安装

```sh
npm install @dotmind/react-use-pwa
```

也可以使用：`pnpm add @dotmind/react-use-pwa`、`yarn add @dotmind/react-use-pwa`、`bun add @dotmind/react-use-pwa`

## README

![header](https://raw.githubusercontent.com/dotmind/react-use-pwa/master/assets/header.png)

# @ dotmind/ react-use-pwa (英语)

快速安装进步Web App 和更多 React shooks 。 由 [.mind.io (英语)](https://dotmind.io/)

 [![](https://img.shields.io/npm/v/@dotmind/react-use-pwa)](https://www.npmjs.com/package/@dotmind/react-use-pwa)[![](https://img.shields.io/npm/dw/@dotmind/react-use-pwa) ](https://www.npmjs.com/package/@dotmind/react-use-pwa)[![](https://img.shields.io/github/license/dotmind/react-use-pwa) ](https://github.com/dotmind/react-use-pwa)[![](https://img.shields.io/npm/types/typescript)](https://github.com/dotmind/rn-shadow-generator)

## 菜单

-   [菜单](https://npmcn.com/package/%40dotmind/react-use-pwa/#readme-menu)
-   [• 免责声明](https://npmcn.com/package/%40dotmind/react-use-pwa/#readme--disclaimer)
-   [\* 安装](https://npmcn.com/package/%40dotmind/react-use-pwa/#readme--installation)
-   [工作怎么样](https://npmcn.com/package/%40dotmind/react-use-pwa/#readme-%EF%B8%8F-how-its-work)
    -   [使用Pwa软件](https://npmcn.com/package/%40dotmind/react-use-pwa/#readme-usepwa-usage)
    -   [使用PwaAppSize 用户](https://npmcn.com/package/%40dotmind/react-use-pwa/#readme-usepwaappsize-usage)
-   [捐款](https://npmcn.com/package/%40dotmind/react-use-pwa/#readme-%EF%B8%8F-contributing)
-   [许可证](https://npmcn.com/package/%40dotmind/react-use-pwa/#readme--license)

## • 免责声明

这个软件包有助于迅速安装和管理安装了React hooks的累进Web App(PWA).

请检查您的应用程序在使用前是否具备要求的标准 : [网页. dev/安装标准](https://web.dev/install-criteria/#criteria)

想做个好PWA吗? [读这个](https://web.dev/pwa-checklist/)

安保部门支助

## \* 安装

```bash
yarn add @dotmind/react-use-pwa
```

或者说

```bash
npm i @dotmind/react-use-pwa --save
```

## 工作怎么样

### 使用Pwa软件

```javascript
import { useEffect, useCallback  } from 'react';
import { usePwa } from '@dotmind/react-use-pwa';

const App = () => {
  const {
    installPrompt,
    isInstalled,
    isStandalone,
    isOffline,
    canInstall,
  } = usePwa();

  const handleInstallPrompt = useCallback(() => {
    if (canInstall) {
      installPrompt();
    }
  }, [canInstall, installPrompt]);

  if (isOffline) {
    return <p>Please check your network 📶</p>;
  }

  if (!isInstalled || !isStandalone) {
    return (
      <button onClick={handleInstallPrompt}>
        <span>Hey install our app 👋</span>
      </button>
    );
  }

  return (
    <h1>Welcome to our new app 🚀</h1>
  );
};

```

|  | 说明 | 类型 |
| --- | --- | --- |
| 安装Prompt | 显示安装提示 | `() => Promise<void>` |
| 已安装 | 应用程序安装在设备上 | `boolean` |
| 单体 | 是应用程序以独立模式运行 | `boolean` |
| 是线 | 是应用程序在离线模式下运行 | `boolean` |
| 安装 | 设备可以安装应用程序 | `boolean` |
| 用户选择 | 快速用户选择 | `'accepted' | 'dismissed' | 'unknow'` |

### 使用PwaAppSize 用户

选择应用启动宽度和高度( 仅以桌面独立模式) .

```javascript
import { usePwaAppSize } from '@dotmind/react-use-pwa';

const App = () => {
  usePwaAppSize(400, 560);

  return <AppProvider />;
};
```

| 参数 | 说明 | 所需经费 | 默认值 |
| --- | --- | --- | --- |
| 宽度 | 应用宽度 | 虚假 | `800` |
| 高度 | 应用高度 | 虚假 | `800` |
| 选项 | 应用程序 | 虚假 | `{ fixed: false }` |

**应用程序**

| 选项 | 说明 | 类型 |
| --- | --- | --- |
| 已固定 | 用户不能调整应用程序宽度和高度大小( H) | `boolean` |

## 捐款

欢迎拉动请求。 对于重大变动,请先开出一个问题来讨论你想要改变什么.

请确保酌情更新测试.

## 许可证

[麻省理工学院](https://choosealicense.com/licenses/mit/)

## 常见问题

### @dotmind/react-use-pwa 是什么？

快速安装进步 Web App 和更多 React shocks

### 如何安装 @dotmind/react-use-pwa？

在项目目录运行 npm install @dotmind/react-use-pwa，或使用 pnpm add / yarn add / bun add。

### @dotmind/react-use-pwa 支持 TypeScript 吗？

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

### @dotmind/react-use-pwa 支持 ESM 还是 CommonJS？

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

### @dotmind/react-use-pwa 可以商用吗？

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

### @dotmind/react-use-pwa 的下载量有多少？

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

### @dotmind/react-use-pwa 还在维护吗？

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