# @fatso83/retry-dynamic-import 中文文档

规范地址：https://npmcn.com/package/%40fatso83/retry-dynamic-import/

版本：2\.3\.0
npm 元数据更新时间：2026-10-04T21:08:41.506Z
中文译文更新时间：2026-11-14T11:48:53.595Z
软件包许可：MIT

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

原始 npm 页面：https://www.npmjs.com/package/%40fatso83/retry-dynamic-import
原文对照：https://npmcn.com/package/%40fatso83/retry-dynamic-import/?lang=original
项目主页：https://github.com/fatso83/retry-dynamic-import#readme
源码仓库：https://github.com/fatso83/retry-dynamic-import

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

- 包体积（解压后）：13.8 kB，9 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- 运行依赖：0 个
- 首次发布：2023-05-09T21:19:32.576Z
- 最新版本发布：2026-10-04T21:08:41.354Z
- 近 30 天下载量：68478（2026-10-15 至 2026-11-13，npm 官方下载统计）
- 已发布版本数：25（近 12 个月 2 个）

## 中文简介

> 使用缓存突袭和指数回放重试动态导入

## 安装

```sh
npm install @fatso83/retry-dynamic-import
```

也可以使用：`pnpm add @fatso83/retry-dynamic-import`、`yarn add @fatso83/retry-dynamic-import`、`bun add @fatso83/retry-dynamic-import`

## README

# 重试动态导入

> 使用缓存突袭和指数回放重试动态导入

[![npm version](https://img.shields.io/npm/v/@fatso83/retry-dynamic-import.svg?style=flat)](https://www.npmjs.com/package/@fatso83/retry-dynamic-import/)

你知道吗 [HTML 规格](https://html.spec.whatwg.org/#fetch-a-single-module-script) 要缓存失败的动态导入分辨率吗 ? 结果,大多数人一旦在生产中使用动态进口的应用软件,并在一段时间后开始看到奇怪错误,就会知道这一点。 我也没有,我最后做了 [很多调试和咆哮](https://stackoverflow.com/a/76200536/200987) 在我发现之前收到用户的神秘错误报告 [什么工作组的问题](https://github.com/whatwg/html/issues/6768) 确切地说,这种情况。 由于从2021年起,这一直处于一个站台,我最终创建了这个图书馆来围绕问题开展工作.

这个软件包原本是阿隆·米兹拉希作品的叉子,但新代码不再使用阿隆的方法,这种方法依赖于解析 Chromium特有出错消息,而新取法在Firefox等浏览器中也起作用.

已完成的改进:

-   单位测试
-   XQ 支持非铬浏览器( 如 Firefox)
-   QQ 树可摇动( 如果您只是使用非反应比特, 请不要在反应中拉动)
-   qq 通过不等待第一次缓存破解尝试来加快对受影响客户的解析
-   将导出固定为同时使用节点Next和"经典"模块分辨率与 Typescript工作
-   · 双重出口(目前只是无害环境管理),如果想要,大声喊出来(我们已经生产了 `*.cjs` 文档)

## 为什么不直接抓住失败并重新装入页面?

在 Firefox 中,虽然效果很好,但在基于 Chromium (Edge, Chrome,...) 的浏览器中,一个失败的模块导入是 _已缓存_ 而失败是 _粘着_:在重新装入或浏览器重启时(每Chrome 113次)没有重试. 这是 _真实_ 失败, 而不是 DevTool URL 屏蔽, 就是 _不粘着_无论出于什么原因.

## 德莫吗?

1.  打开 [在 Github 页面上部署的演示应用程序](https://fatso83.github.io/retry-dynamic-import/demo)
2.  打开 DevTools 并刷新页面
3.  右键点击昂贵的 Confession. \* url 并选择屏蔽它
4.  在 DevTools 的网络标签中刷新并查看网络请求失败
5.  解开url,再看它工作

如果你想看到上面提到的粘滞行为,设置 [Charles Proxy及其"断点"功能](https://www.charlesproxy.com/documentation/proxying/breakpoints/) 能够有选择地阻止或接受请求。 干得不错!

## 限制

过境进口:改为 [本条](https://medium.com/@alonmiz1234/retry-dynamic-imports-with-react-lazy-c7755a7d557a) 了解细节 说明动态进口可能如何失败,以及这如何解决其中一些用途。 一种无法解决的用法是,如果过渡性 依赖性不应加载 .

## 安装

```
npm i @fatso83/retry-dynamic-import
```

## 使用量

包有两大出口

```javascript
export const dynamicImportWithRetry // default implementation with 5 retries
export const createDynamicImportWithRetry  // factory to make your own version of dynamicImportWithRetry
```

### 香草 JS 乌蒂尔

> 任何框架内的工作

```typescript
import { dynamicImportWithRetry } from "@fatso83/retry-dynamic-import";
const myModule = dynamicImportWithRetry(() => import("./my-module")); // this works regardless of framework, lib, etc
```

参见单位测试或执行它支持什么选项.

### 自定义策略

这个 `createDynamicImportWithRetry` 工厂最近有了一个新的功能 允许您通过 _您的自定义策略_ 用于处理进口,而不是预先界定的。 测试中显示的一个具体的使用案例是,这为支持重复试验打开了大门 _动态_ 导入路径.

```typescript
// ONE-TIME SETUP
const moduleSpecifierSymbol = Symbol()
const lookupUsingSymbolInImporter: UrlStrategy = (_, importer) =>
    moduleSpecifierSymbol in importer
    ? String(importer[moduleSpecifierSymbol])
    : null;

const customRetryImport = createDynamicImportWithRetry(3, {strategy: lookupUsingSymbolInImporter})
// ...

// USE
// This can now be used with dynamically created paths like this
const path = readFromUser();
const importer = Object.assign(() => import(path), {
    [moduleSpecifierSymbol]: path,
});

await customRetryImport(importer)
```

### 反应工具

亚瑟利,你可以 `import reactLazyWithRetry from '@fatso83/retry-dynamic-import/react-lazy'` 用于取代 React.lazy () 用于用回推器懒惰地导入的功能。 在1版中,\* 这一点在根上暴露,但大多数捆绑者是 [无法树摇反射](https://github.com/fatso83/retry-dynamic-import/issues/1),所以我决定做一个突破 更改版本2, 暴露它的子路径导出.

_反应是可选的_ 此软件包的依赖性 , 这意味着您可以通过指定来使用 Svelte 或 VanillaJS 而无需拉入额外的依赖性 `npm install --omit=optional`但是,如果你使用 `react-lazy` 子导出您当然需要在您的依赖树中反应 :

### 懒惰与重试反应

上面的薄薄包裹,呼唤 `React.lazy()`

```tsx
const LazyAbout = reactLazyWithRetry(() => import("./components/About"));
const LazyHome = reactLazyWithRetry(() => import("./components/Home"));

const App = () => (
  <Router>
    <Suspense fallback={<div>Loading...</div>}>
      <Routes>
        <Route path="/" element={<LazyHome />} />
        <Route path="/about" element={<LazyAbout />} />
      </Routes>
    </Suspense>
  </Router>
);
```

## 捐款

请吧!

-   运行测试 : `DEBUG=dynamic-import:* npm t -- --watch` (env var 只是用于动词输出)

### 发布补丁发布

承诺进行所有修改 `main` 和 npm 认证配置, 运行 :

```sh
npm version patch
```

这是完整的释放命令。 这个 `preversion` 钩子安装演示 和消费者的依赖性 与他们的锁文件 `npm ci`,然后进行单元测试、建筑测试、消费者测试和 包装检查。 npm 递增版本并创建版本 和标签。 这个 `postversion` 钩头重建新版本,验证 实际的柏油球, 发布柏油球到npm, 更新演示在 GitHub Pages, 并推出树枝和标签.

Npm 认证缺失或过期, 请运行 `npm login` 先说 时间可能 还请您认证出版操作.

不单独运行 `npm publish` 从源检出。 释放 命令从 `pkg/` 换句话说.

### 不出版包装

使用 `npm run pack:release` 在 `pkg/` 不发布或更改版本.

为了单独检查: `npm test`, (中文(简体) ), `npm run build`, (中文(简体) ), `npm run test-consumers`,以及 `npm run test:package`。软件包测试安装 实际数 `.tgz` 成为临时消费者,并核实出口的运行时间, TypeScript 导入, 并重试 Vite 默认生产后的行为 微调化。 直接从源检出中包装或发布为 因为它的广告条目文件只存在于 `pkg/` 建会后.

## 常见问题

### @fatso83/retry-dynamic-import 是什么？

使用缓存突袭和指数回放重试动态导入

### 如何安装 @fatso83/retry-dynamic-import？

在项目目录运行 npm install @fatso83/retry-dynamic-import，或使用 pnpm add / yarn add / bun add。

### @fatso83/retry-dynamic-import 支持 TypeScript 吗？

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

### @fatso83/retry-dynamic-import 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @fatso83/retry-dynamic-import 可以商用吗？

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

### @fatso83/retry-dynamic-import 的下载量有多少？

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

### @fatso83/retry-dynamic-import 还在维护吗？

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