Skip to content

Commit 30a2daa

Browse files
committed
Add named export lazyWithPreload
1 parent bf5ace8 commit 30a2daa

File tree

5 files changed

+14
-8
lines changed

5 files changed

+14
-8
lines changed

README.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,14 +19,14 @@ const OtherComponent = lazy(() => import("./OtherComponent"));
1919

2020
```js
2121
import { Suspense } from "react";
22-
import lazy from "react-lazy-with-preload";
23-
const OtherComponent = lazy(() => import("./OtherComponent"));
22+
import { lazyWithPreload } from "react-lazy-with-preload";
23+
const OtherComponent = lazyWithPreload(() => import("./OtherComponent"));
2424

2525
// ...
2626
OtherComponent.preload();
2727
```
2828

29-
To preload a component before it is rendered for the first time, the component that is returned from `lazy()` has a `preload` function attached that you can invoke. `preload()` returns a `Promise` that you can wait on if needed. The promise is idempotent, meaning that `preload()` will return the same `Promise` instance if called multiple times.
29+
To preload a component before it is rendered for the first time, the component that is returned from `lazyWithPreload()` has a `preload` function attached that you can invoke. `preload()` returns a `Promise` that you can wait on if needed. The promise is idempotent, meaning that `preload()` will return the same `Promise` instance if called multiple times.
3030

3131
For more information about React code-splitting, `React.lazy` and `React.Suspense`, see https://reactjs.org/docs/code-splitting.html.
3232

package-lock.json

Lines changed: 2 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-lazy-with-preload",
3-
"version": "2.1.0",
3+
"version": "2.2.0",
44
"description": "Wraps the React.lazy API with preload functionality",
55
"main": "lib/index.js",
66
"types": "lib/index.d.ts",

src/__tests__/index.test.tsx

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from "react";
22
import { act, render, screen, waitFor } from "@testing-library/react";
3-
import lazy from "../index";
3+
import lazy, { lazyWithPreload as namedExport } from "../index";
44

55
function getTestComponentModule() {
66
const TestComponent = React.forwardRef<
@@ -154,4 +154,8 @@ describe("lazy", () => {
154154

155155
expect(preloadedComponent).toBe(OriginalComponent);
156156
});
157+
158+
it("exports named export as well", () => {
159+
expect(lazy).toBe(namedExport);
160+
});
157161
});

src/index.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ export type PreloadableComponent<T extends ComponentType<any>> = T & {
44
preload: () => Promise<T>;
55
};
66

7-
export default function lazyWithPreload<T extends ComponentType<any>>(
7+
export function lazyWithPreload<T extends ComponentType<any>>(
88
factory: () => Promise<{ default: T }>
99
): PreloadableComponent<T> {
1010
const LazyComponent = lazy(factory);
@@ -31,3 +31,5 @@ export default function lazyWithPreload<T extends ComponentType<any>>(
3131

3232
return Component;
3333
}
34+
35+
export default lazyWithPreload;

0 commit comments

Comments
 (0)