diff --git a/package.json b/package.json
index 833536917..ce680055f 100644
--- a/package.json
+++ b/package.json
@@ -2,18 +2,30 @@
   "name": "react-pdf",
   "version": "7.2.0",
   "description": "Display PDFs in your React app as easily as if they were images.",
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
-  "source": "src/index.ts",
-  "types": "dist/cjs/index.d.ts",
+  "type": "module",
   "sideEffects": [
     "*.css"
   ],
+  "main": "./dist/cjs/index.js",
+  "module": "./dist/esm/index.js",
+  "source": "./src/index.ts",
+  "types": "./dist/cjs/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/esm/index.js",
+      "require": "./dist/cjs/index.js"
+    },
+    "./dist/cjs/Page/AnnotationLayer.css": "./dist/cjs/Page/AnnotationLayer.css",
+    "./dist/cjs/Page/TextLayer.css": "./dist/cjs/Page/TextLayer.css",
+    "./dist/esm/Page/AnnotationLayer.css": "./dist/esm/Page/AnnotationLayer.css",
+    "./dist/esm/Page/TextLayer.css": "./dist/esm/Page/TextLayer.css"
+  },
   "scripts": {
     "build": "yarn build-js && yarn copy-styles",
-    "build-js": "yarn build-js-esm && yarn build-js-cjs",
+    "build-js": "yarn build-js-esm && yarn build-js-cjs && yarn build-js-cjs-package",
     "build-js-esm": "tsc --project tsconfig.build.json --outDir dist/esm --module esnext",
     "build-js-cjs": "tsc --project tsconfig.build.json --outDir dist/cjs --module commonjs",
+    "build-js-cjs-package": "echo '{\n  \"type\": \"commonjs\"\n}' > dist/cjs/package.json",
     "clean": "rimraf dist",
     "copy-styles": "cpy 'src/**/*.css' dist/esm && cpy 'src/**/*.css' dist/cjs",
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx",
@@ -23,7 +35,7 @@
     "test": "yarn lint && yarn tsc && yarn prettier && yarn unit",
     "tsc": "tsc --noEmit",
     "unit": "vitest",
-    "watch": "yarn build-js-esm --watch & yarn build-js-cjs --watch & nodemon --watch src --ext css --exec \"yarn copy-styles\""
+    "watch": "yarn build-js-esm --watch & yarn build-js-cjs --watch & yarn build-js-cjs-package & nodemon --watch src --ext css --exec \"yarn copy-styles\""
   },
   "keywords": [
     "pdf",
diff --git a/src/Document.spec.tsx b/src/Document.spec.tsx
index 03fc10551..8e4a2ef14 100644
--- a/src/Document.spec.tsx
+++ b/src/Document.spec.tsx
@@ -2,16 +2,16 @@ import { beforeAll, describe, expect, it, vi } from 'vitest';
 import React, { createRef } from 'react';
 import { fireEvent, getByTestId, render } from '@testing-library/react';
 
-import { pdfjs } from './index.test';
+import { pdfjs } from './index.test.js';
 
-import Document from './Document';
-import DocumentContext from './DocumentContext';
-import Page from './Page';
+import Document from './Document.js';
+import DocumentContext from './DocumentContext.js';
+import Page from './Page.js';
 
-import { makeAsyncCallback, loadPDF, muteConsole, restoreConsole } from '../test-utils';
+import { makeAsyncCallback, loadPDF, muteConsole, restoreConsole } from '../test-utils.js';
 
 import type { PDFDocumentProxy } from 'pdfjs-dist';
-import type { ScrollPageIntoViewArgs } from './shared/types';
+import type { ScrollPageIntoViewArgs } from './shared/types.js';
 
 const pdfFile = loadPDF('./__mocks__/_pdf.pdf');
 const pdfFile2 = loadPDF('./__mocks__/_pdf2.pdf');
diff --git a/src/Document.tsx b/src/Document.tsx
index 30f269930..886ca5ad4 100644
--- a/src/Document.tsx
+++ b/src/Document.tsx
@@ -19,12 +19,12 @@ import invariant from 'tiny-invariant';
 import warning from 'tiny-warning';
 import * as pdfjs from 'pdfjs-dist';
 
-import DocumentContext from './DocumentContext';
+import DocumentContext from './DocumentContext.js';
 
-import Message from './Message';
+import Message from './Message.js';
 
-import LinkService from './LinkService';
-import PasswordResponses from './PasswordResponses';
+import LinkService from './LinkService.js';
+import PasswordResponses from './PasswordResponses.js';
 
 import {
   cancelRunningTask,
@@ -35,10 +35,10 @@ import {
   isBrowser,
   isDataURI,
   loadFromFile,
-} from './shared/utils';
+} from './shared/utils.js';
 
-import useResolver from './shared/hooks/useResolver';
-import { eventProps, isClassName, isFile, isRef } from './shared/propTypes';
+import useResolver from './shared/hooks/useResolver.js';
+import { eventProps, isClassName, isFile, isRef } from './shared/propTypes.js';
 
 import type { PDFDocumentProxy } from 'pdfjs-dist';
 import type { EventProps } from 'make-event-props';
@@ -61,7 +61,7 @@ import type {
   RenderMode,
   ScrollPageIntoViewArgs,
   Source,
-} from './shared/types';
+} from './shared/types.js';
 
 const { PDFDataRangeTransport } = pdfjs;
 
diff --git a/src/DocumentContext.tsx b/src/DocumentContext.tsx
index e1d22ba61..2cc037e82 100644
--- a/src/DocumentContext.tsx
+++ b/src/DocumentContext.tsx
@@ -2,6 +2,6 @@
 
 import { createContext } from 'react';
 
-import type { DocumentContextType } from './shared/types';
+import type { DocumentContextType } from './shared/types.js';
 
 export default createContext<DocumentContextType>(null);
diff --git a/src/LinkService.ts b/src/LinkService.ts
index 41b633dc3..4d83eb9f7 100644
--- a/src/LinkService.ts
+++ b/src/LinkService.ts
@@ -21,9 +21,9 @@ import type {
   ExternalLinkRel,
   ExternalLinkTarget,
   ScrollPageIntoViewArgs,
-} from './shared/types';
+} from './shared/types.js';
 
-import type { IPDFLinkService } from 'pdfjs-dist/types/web/interfaces';
+import type { IPDFLinkService } from 'pdfjs-dist/types/web/interfaces.js';
 
 const DEFAULT_LINK_REL = 'noopener noreferrer nofollow';
 
diff --git a/src/Outline.spec.tsx b/src/Outline.spec.tsx
index c23fda5e7..ab70826e7 100644
--- a/src/Outline.spec.tsx
+++ b/src/Outline.spec.tsx
@@ -2,17 +2,17 @@ import { beforeAll, describe, expect, it } from 'vitest';
 import React, { createRef } from 'react';
 import { render, screen } from '@testing-library/react';
 
-import { pdfjs } from './index.test';
+import { pdfjs } from './index.test.js';
 
-import Outline from './Outline';
+import Outline from './Outline.js';
 
-import failingPdf from '../__mocks__/_failing_pdf';
-import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../test-utils';
+import failingPdf from '../__mocks__/_failing_pdf.js';
+import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../test-utils.js';
 
-import DocumentContext from './DocumentContext';
+import DocumentContext from './DocumentContext.js';
 
 import type { PDFDocumentProxy } from 'pdfjs-dist';
-import type { DocumentContextType } from './shared/types';
+import type { DocumentContextType } from './shared/types.js';
 
 type PDFOutline = Awaited<ReturnType<PDFDocumentProxy['getOutline']>>;
 
diff --git a/src/Outline.tsx b/src/Outline.tsx
index 048c6c073..3e1f532d0 100644
--- a/src/Outline.tsx
+++ b/src/Outline.tsx
@@ -8,19 +8,19 @@ import clsx from 'clsx';
 import invariant from 'tiny-invariant';
 import warning from 'tiny-warning';
 
-import OutlineContext from './OutlineContext';
+import OutlineContext from './OutlineContext.js';
 
-import OutlineItem from './OutlineItem';
+import OutlineItem from './OutlineItem.js';
 
-import { cancelRunningTask } from './shared/utils';
+import { cancelRunningTask } from './shared/utils.js';
 
-import useDocumentContext from './shared/hooks/useDocumentContext';
-import useResolver from './shared/hooks/useResolver';
-import { eventProps, isClassName, isPdf, isRef } from './shared/propTypes';
+import useDocumentContext from './shared/hooks/useDocumentContext.js';
+import useResolver from './shared/hooks/useResolver.js';
+import { eventProps, isClassName, isPdf, isRef } from './shared/propTypes.js';
 
 import type { PDFDocumentProxy } from 'pdfjs-dist';
 import type { EventProps } from 'make-event-props';
-import type { ClassName, OnItemClickArgs } from './shared/types';
+import type { ClassName, OnItemClickArgs } from './shared/types.js';
 
 type PDFOutline = Awaited<ReturnType<PDFDocumentProxy['getOutline']>>;
 
diff --git a/src/OutlineContext.tsx b/src/OutlineContext.tsx
index 4ccc98459..b290706ca 100644
--- a/src/OutlineContext.tsx
+++ b/src/OutlineContext.tsx
@@ -2,6 +2,6 @@
 
 import { createContext } from 'react';
 
-import type { OutlineContextType } from './shared/types';
+import type { OutlineContextType } from './shared/types.js';
 
 export default createContext<OutlineContextType>(null);
diff --git a/src/OutlineItem.spec.tsx b/src/OutlineItem.spec.tsx
index de9bf7cbb..364815745 100644
--- a/src/OutlineItem.spec.tsx
+++ b/src/OutlineItem.spec.tsx
@@ -2,16 +2,16 @@ import { beforeAll, describe, expect, it, vi } from 'vitest';
 import React from 'react';
 import { fireEvent, getAllByRole, render, screen } from '@testing-library/react';
 
-import { pdfjs } from './index.test';
-import OutlineItem from './OutlineItem';
+import { pdfjs } from './index.test.js';
+import OutlineItem from './OutlineItem.js';
 
-import { loadPDF, makeAsyncCallback } from '../test-utils';
+import { loadPDF, makeAsyncCallback } from '../test-utils.js';
 
-import DocumentContext from './DocumentContext';
-import OutlineContext from './OutlineContext';
+import DocumentContext from './DocumentContext.js';
+import OutlineContext from './OutlineContext.js';
 
 import type { PDFDocumentProxy } from 'pdfjs-dist';
-import type { DocumentContextType, OutlineContextType } from './shared/types';
+import type { DocumentContextType, OutlineContextType } from './shared/types.js';
 
 const pdfFile = loadPDF('./__mocks__/_pdf.pdf');
 
diff --git a/src/OutlineItem.tsx b/src/OutlineItem.tsx
index 0e14f1a3f..3f41299fd 100644
--- a/src/OutlineItem.tsx
+++ b/src/OutlineItem.tsx
@@ -1,14 +1,14 @@
 import React from 'react';
 import invariant from 'tiny-invariant';
 
-import Ref from './Ref';
+import Ref from './Ref.js';
 
-import useCachedValue from './shared/hooks/useCachedValue';
-import useDocumentContext from './shared/hooks/useDocumentContext';
-import useOutlineContext from './shared/hooks/useOutlineContext';
+import useCachedValue from './shared/hooks/useCachedValue.js';
+import useDocumentContext from './shared/hooks/useDocumentContext.js';
+import useOutlineContext from './shared/hooks/useOutlineContext.js';
 
 import type { PDFDocumentProxy } from 'pdfjs-dist';
-import type { RefProxy } from 'pdfjs-dist/types/src/display/api';
+import type { RefProxy } from 'pdfjs-dist/types/src/display/api.js';
 
 type PDFOutline = Awaited<ReturnType<PDFDocumentProxy['getOutline']>>;
 
diff --git a/src/Page.spec.tsx b/src/Page.spec.tsx
index b4b04598f..8654a971d 100644
--- a/src/Page.spec.tsx
+++ b/src/Page.spec.tsx
@@ -2,18 +2,18 @@ import { beforeAll, describe, expect, it, vi } from 'vitest';
 import React, { createRef } from 'react';
 import { fireEvent, render } from '@testing-library/react';
 
-import { pdfjs } from './index.test';
+import { pdfjs } from './index.test.js';
 
-import Page from './Page';
+import Page from './Page.js';
 
-import failingPdf from '../__mocks__/_failing_pdf';
-import silentlyFailingPdf from '../__mocks__/_silently_failing_pdf';
-import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../test-utils';
+import failingPdf from '../__mocks__/_failing_pdf.js';
+import silentlyFailingPdf from '../__mocks__/_silently_failing_pdf.js';
+import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../test-utils.js';
 
-import DocumentContext from './DocumentContext';
+import DocumentContext from './DocumentContext.js';
 
 import type { PDFDocumentProxy, PDFPageProxy } from 'pdfjs-dist';
-import type { DocumentContextType, PageCallback } from './shared/types';
+import type { DocumentContextType, PageCallback } from './shared/types.js';
 
 const pdfFile = loadPDF('./__mocks__/_pdf.pdf');
 const pdfFile2 = loadPDF('./__mocks__/_pdf2.pdf');
diff --git a/src/Page.tsx b/src/Page.tsx
index 0cd84cef8..945c49666 100644
--- a/src/Page.tsx
+++ b/src/Page.tsx
@@ -9,18 +9,18 @@ import mergeRefs from 'merge-refs';
 import invariant from 'tiny-invariant';
 import warning from 'tiny-warning';
 
-import PageContext from './PageContext';
+import PageContext from './PageContext.js';
 
-import Message from './Message';
-import PageCanvas from './Page/PageCanvas';
-import PageSVG from './Page/PageSVG';
-import TextLayer from './Page/TextLayer';
-import AnnotationLayer from './Page/AnnotationLayer';
+import Message from './Message.js';
+import PageCanvas from './Page/PageCanvas.js';
+import PageSVG from './Page/PageSVG.js';
+import TextLayer from './Page/TextLayer.js';
+import AnnotationLayer from './Page/AnnotationLayer.js';
 
-import { cancelRunningTask, isProvided, makePageCallback } from './shared/utils';
+import { cancelRunningTask, isProvided, makePageCallback } from './shared/utils.js';
 
-import useDocumentContext from './shared/hooks/useDocumentContext';
-import useResolver from './shared/hooks/useResolver';
+import useDocumentContext from './shared/hooks/useDocumentContext.js';
+import useResolver from './shared/hooks/useResolver.js';
 import {
   eventProps,
   isClassName,
@@ -30,7 +30,7 @@ import {
   isRef,
   isRenderMode,
   isRotate,
-} from './shared/propTypes';
+} from './shared/propTypes.js';
 
 import type { PDFDocumentProxy, PDFPageProxy } from 'pdfjs-dist';
 import type { EventProps } from 'make-event-props';
@@ -55,7 +55,7 @@ import type {
   OnRenderTextLayerSuccess,
   PageCallback,
   RenderMode,
-} from './shared/types';
+} from './shared/types.js';
 
 const defaultScale = 1;
 
diff --git a/src/Page/AnnotationLayer.spec.tsx b/src/Page/AnnotationLayer.spec.tsx
index 58dc0ecbc..cfe9208c7 100644
--- a/src/Page/AnnotationLayer.spec.tsx
+++ b/src/Page/AnnotationLayer.spec.tsx
@@ -2,21 +2,21 @@ import { beforeAll, describe, expect, it } from 'vitest';
 import React from 'react';
 import { render } from '@testing-library/react';
 
-import { pdfjs } from '../index.test';
+import { pdfjs } from '../index.test.js';
 
-import AnnotationLayer from './AnnotationLayer';
-import LinkService from '../LinkService';
+import AnnotationLayer from './AnnotationLayer.js';
+import LinkService from '../LinkService.js';
 
-import failingPage from '../../__mocks__/_failing_page';
+import failingPage from '../../__mocks__/_failing_page.js';
 
-import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../../test-utils';
+import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../../test-utils.js';
 
-import DocumentContext from '../DocumentContext';
-import PageContext from '../PageContext';
+import DocumentContext from '../DocumentContext.js';
+import PageContext from '../PageContext.js';
 
 import type { RenderResult } from '@testing-library/react';
 import type { PDFDocumentProxy, PDFPageProxy } from 'pdfjs-dist';
-import type { Annotations, DocumentContextType, PageContextType } from '../shared/types';
+import type { Annotations, DocumentContextType, PageContextType } from '../shared/types.js';
 
 const pdfFile = loadPDF('./__mocks__/_pdf.pdf');
 const annotatedPdfFile = loadPDF('./__mocks__/_pdf3.pdf');
diff --git a/src/Page/AnnotationLayer.tsx b/src/Page/AnnotationLayer.tsx
index 07cca6612..049019b14 100644
--- a/src/Page/AnnotationLayer.tsx
+++ b/src/Page/AnnotationLayer.tsx
@@ -7,12 +7,12 @@ import invariant from 'tiny-invariant';
 import warning from 'tiny-warning';
 import * as pdfjs from 'pdfjs-dist';
 
-import useDocumentContext from '../shared/hooks/useDocumentContext';
-import usePageContext from '../shared/hooks/usePageContext';
-import useResolver from '../shared/hooks/useResolver';
-import { cancelRunningTask } from '../shared/utils';
+import useDocumentContext from '../shared/hooks/useDocumentContext.js';
+import usePageContext from '../shared/hooks/usePageContext.js';
+import useResolver from '../shared/hooks/useResolver.js';
+import { cancelRunningTask } from '../shared/utils.js';
 
-import type { Annotations } from '../shared/types';
+import type { Annotations } from '../shared/types.js';
 
 export default function AnnotationLayer() {
   const documentContext = useDocumentContext();
diff --git a/src/Page/PageCanvas.spec.tsx b/src/Page/PageCanvas.spec.tsx
index f464802c7..3138b896b 100644
--- a/src/Page/PageCanvas.spec.tsx
+++ b/src/Page/PageCanvas.spec.tsx
@@ -2,18 +2,18 @@ import { beforeAll, describe, expect, it, vi } from 'vitest';
 import React from 'react';
 import { render } from '@testing-library/react';
 
-import { pdfjs } from '../index.test';
+import { pdfjs } from '../index.test.js';
 
-import PageCanvas from './PageCanvas';
+import PageCanvas from './PageCanvas.js';
 
-import failingPage from '../../__mocks__/_failing_page';
+import failingPage from '../../__mocks__/_failing_page.js';
 
-import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../../test-utils';
+import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../../test-utils.js';
 
-import PageContext from '../PageContext';
+import PageContext from '../PageContext.js';
 
 import type { PDFPageProxy } from 'pdfjs-dist';
-import type { PageContextType } from '../shared/types';
+import type { PageContextType } from '../shared/types.js';
 
 const pdfFile = loadPDF('./__mocks__/_pdf.pdf');
 
diff --git a/src/Page/PageCanvas.tsx b/src/Page/PageCanvas.tsx
index a135bcbe9..f97d52c54 100644
--- a/src/Page/PageCanvas.tsx
+++ b/src/Page/PageCanvas.tsx
@@ -6,17 +6,17 @@ import invariant from 'tiny-invariant';
 import warning from 'tiny-warning';
 import * as pdfjs from 'pdfjs-dist';
 
-import StructTree from '../StructTree';
+import StructTree from '../StructTree.js';
 
-import usePageContext from '../shared/hooks/usePageContext';
+import usePageContext from '../shared/hooks/usePageContext.js';
 import {
   cancelRunningTask,
   getDevicePixelRatio,
   isCancelException,
   makePageCallback,
-} from '../shared/utils';
+} from '../shared/utils.js';
 
-import type { RenderParameters } from 'pdfjs-dist/types/src/display/api';
+import type { RenderParameters } from 'pdfjs-dist/types/src/display/api.js';
 
 const ANNOTATION_MODE = pdfjs.AnnotationMode;
 
diff --git a/src/Page/PageSVG.spec.tsx b/src/Page/PageSVG.spec.tsx
index 790d534df..7f7c25c7f 100644
--- a/src/Page/PageSVG.spec.tsx
+++ b/src/Page/PageSVG.spec.tsx
@@ -2,18 +2,18 @@ import { beforeAll, describe, expect, it } from 'vitest';
 import React from 'react';
 import { render } from '@testing-library/react';
 
-import { pdfjs } from '../index.test';
+import { pdfjs } from '../index.test.js';
 
-import PageSVG from './PageSVG';
+import PageSVG from './PageSVG.js';
 
-import failingPage from '../../__mocks__/_failing_page';
+import failingPage from '../../__mocks__/_failing_page.js';
 
-import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../../test-utils';
+import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../../test-utils.js';
 
-import PageContext from '../PageContext';
+import PageContext from '../PageContext.js';
 
 import type { PDFPageProxy } from 'pdfjs-dist';
-import type { PageContextType } from '../shared/types';
+import type { PageContextType } from '../shared/types.js';
 
 const pdfFile = loadPDF('./__mocks__/_pdf.pdf');
 
diff --git a/src/Page/PageSVG.tsx b/src/Page/PageSVG.tsx
index 4df14b8dd..848e9cc45 100644
--- a/src/Page/PageSVG.tsx
+++ b/src/Page/PageSVG.tsx
@@ -4,12 +4,12 @@ import invariant from 'tiny-invariant';
 import warning from 'tiny-warning';
 import * as pdfjs from 'pdfjs-dist';
 
-import usePageContext from '../shared/hooks/usePageContext';
-import useResolver from '../shared/hooks/useResolver';
-import { cancelRunningTask, isCancelException, makePageCallback } from '../shared/utils';
+import usePageContext from '../shared/hooks/usePageContext.js';
+import useResolver from '../shared/hooks/useResolver.js';
+import { cancelRunningTask, isCancelException, makePageCallback } from '../shared/utils.js';
 
 import type { PageViewport } from 'pdfjs-dist';
-import type { PDFOperatorList } from 'pdfjs-dist/types/src/display/api';
+import type { PDFOperatorList } from 'pdfjs-dist/types/src/display/api.js';
 
 type SVGGraphics = {
   getSVG: (operatorList: PDFOperatorList, viewport: PageViewport) => Promise<SVGElement>;
diff --git a/src/Page/TextLayer.spec.tsx b/src/Page/TextLayer.spec.tsx
index 2f0ab1799..51035beea 100644
--- a/src/Page/TextLayer.spec.tsx
+++ b/src/Page/TextLayer.spec.tsx
@@ -2,19 +2,19 @@ import { beforeAll, describe, expect, it, vi } from 'vitest';
 import React from 'react';
 import { render } from '@testing-library/react';
 
-import { pdfjs } from '../index.test';
+import { pdfjs } from '../index.test.js';
 
-import TextLayer from './TextLayer';
+import TextLayer from './TextLayer.js';
 
-import failingPage from '../../__mocks__/_failing_page';
+import failingPage from '../../__mocks__/_failing_page.js';
 
-import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../../test-utils';
+import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../../test-utils.js';
 
-import PageContext from '../PageContext';
+import PageContext from '../PageContext.js';
 
 import type { PDFPageProxy } from 'pdfjs-dist';
-import type { TextContent } from 'pdfjs-dist/types/src/display/api';
-import type { PageContextType } from '../shared/types';
+import type { TextContent } from 'pdfjs-dist/types/src/display/api.js';
+import type { PageContextType } from '../shared/types.js';
 
 const pdfFile = loadPDF('./__mocks__/_pdf.pdf');
 const untaggedPdfFile = loadPDF('./__mocks__/_untagged.pdf');
diff --git a/src/Page/TextLayer.tsx b/src/Page/TextLayer.tsx
index ad26d7f91..6b7306237 100644
--- a/src/Page/TextLayer.tsx
+++ b/src/Page/TextLayer.tsx
@@ -7,11 +7,11 @@ import invariant from 'tiny-invariant';
 import warning from 'tiny-warning';
 import * as pdfjs from 'pdfjs-dist';
 
-import usePageContext from '../shared/hooks/usePageContext';
-import useResolver from '../shared/hooks/useResolver';
-import { cancelRunningTask } from '../shared/utils';
+import usePageContext from '../shared/hooks/usePageContext.js';
+import useResolver from '../shared/hooks/useResolver.js';
+import { cancelRunningTask } from '../shared/utils.js';
 
-import type { TextContent, TextItem, TextMarkedContent } from 'pdfjs-dist/types/src/display/api';
+import type { TextContent, TextItem, TextMarkedContent } from 'pdfjs-dist/types/src/display/api.js';
 
 function isTextItem(item: TextItem | TextMarkedContent): item is TextItem {
   return 'str' in item;
diff --git a/src/PageContext.tsx b/src/PageContext.tsx
index 8548c27c9..4bdf4d896 100644
--- a/src/PageContext.tsx
+++ b/src/PageContext.tsx
@@ -2,6 +2,6 @@
 
 import { createContext } from 'react';
 
-import type { PageContextType } from './shared/types';
+import type { PageContextType } from './shared/types.js';
 
 export default createContext<PageContextType>(null);
diff --git a/src/Ref.spec.ts b/src/Ref.spec.ts
index 8e0292d72..9f28edffc 100644
--- a/src/Ref.spec.ts
+++ b/src/Ref.spec.ts
@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import Ref from './Ref';
+import Ref from './Ref.js';
 
 describe('Ref', () => {
   it('returns proper reference for given num and gen', () => {
diff --git a/src/StructTree.spec.tsx b/src/StructTree.spec.tsx
index ebe99eb79..d827a212f 100644
--- a/src/StructTree.spec.tsx
+++ b/src/StructTree.spec.tsx
@@ -2,18 +2,18 @@ import { beforeAll, describe, expect, it } from 'vitest';
 import React from 'react';
 import { render } from '@testing-library/react';
 
-import { pdfjs } from './index.test';
+import { pdfjs } from './index.test.js';
 
-import StructTree from './StructTree';
+import StructTree from './StructTree.js';
 
-import failingPage from '../__mocks__/_failing_page';
-import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../test-utils';
+import failingPage from '../__mocks__/_failing_page.js';
+import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../test-utils.js';
 
-import PageContext from './PageContext';
+import PageContext from './PageContext.js';
 
 import type { PDFPageProxy } from 'pdfjs-dist';
-import type { PageContextType } from './shared/types';
-import { StructTreeNode } from 'pdfjs-dist/types/src/display/api';
+import type { PageContextType } from './shared/types.js';
+import { StructTreeNode } from 'pdfjs-dist/types/src/display/api.js';
 
 const pdfFile = loadPDF('./__mocks__/_pdf.pdf');
 
diff --git a/src/StructTree.tsx b/src/StructTree.tsx
index b6491b740..8e438328d 100644
--- a/src/StructTree.tsx
+++ b/src/StructTree.tsx
@@ -3,13 +3,13 @@ import makeCancellable from 'make-cancellable-promise';
 import invariant from 'tiny-invariant';
 import warning from 'tiny-warning';
 
-import StructTreeItem from './StructTreeItem';
+import StructTreeItem from './StructTreeItem.js';
 
-import usePageContext from './shared/hooks/usePageContext';
-import useResolver from './shared/hooks/useResolver';
-import { cancelRunningTask } from './shared/utils';
+import usePageContext from './shared/hooks/usePageContext.js';
+import useResolver from './shared/hooks/useResolver.js';
+import { cancelRunningTask } from './shared/utils.js';
 
-import type { StructTreeNodeWithExtraAttributes } from './shared/types';
+import type { StructTreeNodeWithExtraAttributes } from './shared/types.js';
 
 export default function StructTree() {
   const pageContext = usePageContext();
diff --git a/src/StructTreeItem.tsx b/src/StructTreeItem.tsx
index 9d0ffeae7..280f91e8a 100644
--- a/src/StructTreeItem.tsx
+++ b/src/StructTreeItem.tsx
@@ -4,10 +4,10 @@ import {
   getAttributes,
   isStructTreeNode,
   isStructTreeNodeWithOnlyContentChild,
-} from './shared/structTreeUtils';
+} from './shared/structTreeUtils.js';
 
-import type { StructTreeContent } from 'pdfjs-dist/types/src/display/api';
-import type { StructTreeNodeWithExtraAttributes } from './shared/types';
+import type { StructTreeContent } from 'pdfjs-dist/types/src/display/api.js';
+import type { StructTreeNodeWithExtraAttributes } from './shared/types.js';
 
 type StructTreeItemProps = {
   className?: string;
diff --git a/src/Thumbnail.spec.tsx b/src/Thumbnail.spec.tsx
index e0892f80a..f4fd7aecd 100644
--- a/src/Thumbnail.spec.tsx
+++ b/src/Thumbnail.spec.tsx
@@ -2,18 +2,18 @@ import { beforeAll, describe, expect, it, vi } from 'vitest';
 import React, { createRef } from 'react';
 import { fireEvent, render } from '@testing-library/react';
 
-import { pdfjs } from './index.test';
+import { pdfjs } from './index.test.js';
 
-import Thumbnail from './Thumbnail';
+import Thumbnail from './Thumbnail.js';
 
-import failingPdf from '../__mocks__/_failing_pdf';
-import silentlyFailingPdf from '../__mocks__/_silently_failing_pdf';
-import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../test-utils';
+import failingPdf from '../__mocks__/_failing_pdf.js';
+import silentlyFailingPdf from '../__mocks__/_silently_failing_pdf.js';
+import { loadPDF, makeAsyncCallback, muteConsole, restoreConsole } from '../test-utils.js';
 
-import DocumentContext from './DocumentContext';
+import DocumentContext from './DocumentContext.js';
 
 import type { PDFDocumentProxy, PDFPageProxy } from 'pdfjs-dist';
-import type { DocumentContextType, PageCallback } from './shared/types';
+import type { DocumentContextType, PageCallback } from './shared/types.js';
 
 const pdfFile = loadPDF('./__mocks__/_pdf.pdf');
 const pdfFile2 = loadPDF('./__mocks__/_pdf2.pdf');
diff --git a/src/Thumbnail.tsx b/src/Thumbnail.tsx
index 599f25de2..72b6546cf 100644
--- a/src/Thumbnail.tsx
+++ b/src/Thumbnail.tsx
@@ -4,14 +4,14 @@ import React from 'react';
 import clsx from 'clsx';
 import invariant from 'tiny-invariant';
 
-import Page from './Page';
+import Page from './Page.js';
 
-import { isProvided } from './shared/utils';
+import { isProvided } from './shared/utils.js';
 
-import useDocumentContext from './shared/hooks/useDocumentContext';
+import useDocumentContext from './shared/hooks/useDocumentContext.js';
 
-import type { PageProps } from './Page';
-import type { ClassName, OnItemClickArgs } from './shared/types';
+import type { PageProps } from './Page.js';
+import type { ClassName, OnItemClickArgs } from './shared/types.js';
 
 export type ThumbnailProps = Omit<
   PageProps,
diff --git a/src/index.spec.ts b/src/index.spec.ts
index 3705b11d1..0cc068ec9 100644
--- a/src/index.spec.ts
+++ b/src/index.spec.ts
@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { pdfjs, Document, Outline, Page } from './index';
+import { pdfjs, Document, Outline, Page } from './index.js';
 
 describe('default entry', () => {
   describe('has pdfjs exported properly', () => {
diff --git a/src/index.test.ts b/src/index.test.ts
index 35eb3472a..d79ce4af6 100644
--- a/src/index.test.ts
+++ b/src/index.test.ts
@@ -1,18 +1,18 @@
 import * as pdfjs from 'pdfjs-dist';
 
-import Document from './Document';
-import Outline from './Outline';
-import Page from './Page';
-import Thumbnail from './Thumbnail';
+import Document from './Document.js';
+import Outline from './Outline.js';
+import Page from './Page.js';
+import Thumbnail from './Thumbnail.js';
 
-import useDocumentContext from './shared/hooks/useDocumentContext';
-import useOutlineContext from './shared/hooks/useOutlineContext';
-import usePageContext from './shared/hooks/usePageContext';
+import useDocumentContext from './shared/hooks/useDocumentContext.js';
+import useOutlineContext from './shared/hooks/useOutlineContext.js';
+import usePageContext from './shared/hooks/usePageContext.js';
 
-export type { DocumentProps } from './Document';
-export type { OutlineProps } from './Outline';
-export type { PageProps } from './Page';
-export type { ThumbnailProps } from './Thumbnail';
+export type { DocumentProps } from './Document.js';
+export type { OutlineProps } from './Outline.js';
+export type { PageProps } from './Page.js';
+export type { ThumbnailProps } from './Thumbnail.js';
 
 import './pdf.worker.entry';
 
diff --git a/src/index.ts b/src/index.ts
index 824c55086..6ab73c56b 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,20 +1,20 @@
 import * as pdfjs from 'pdfjs-dist';
 
-import Document from './Document';
-import Outline from './Outline';
-import Page from './Page';
-import Thumbnail from './Thumbnail';
+import Document from './Document.js';
+import Outline from './Outline.js';
+import Page from './Page.js';
+import Thumbnail from './Thumbnail.js';
 
-import useDocumentContext from './shared/hooks/useDocumentContext';
-import useOutlineContext from './shared/hooks/useOutlineContext';
-import usePageContext from './shared/hooks/usePageContext';
+import useDocumentContext from './shared/hooks/useDocumentContext.js';
+import useOutlineContext from './shared/hooks/useOutlineContext.js';
+import usePageContext from './shared/hooks/usePageContext.js';
 
-export type { DocumentProps } from './Document';
-export type { OutlineProps } from './Outline';
-export type { PageProps } from './Page';
-export type { ThumbnailProps } from './Thumbnail';
+export type { DocumentProps } from './Document.js';
+export type { OutlineProps } from './Outline.js';
+export type { PageProps } from './Page.js';
+export type { ThumbnailProps } from './Thumbnail.js';
 
-import { displayWorkerWarning } from './shared/utils';
+import { displayWorkerWarning } from './shared/utils.js';
 
 displayWorkerWarning();
 
diff --git a/src/shared/hooks/useCachedValue.ts b/src/shared/hooks/useCachedValue.ts
index f8811369c..dba3b3bbc 100644
--- a/src/shared/hooks/useCachedValue.ts
+++ b/src/shared/hooks/useCachedValue.ts
@@ -2,7 +2,7 @@
 
 import { useRef } from 'react';
 
-import { isDefined } from '../utils';
+import { isDefined } from '../utils.js';
 
 export default function useCachedValue<T>(getter: () => T): () => T {
   const ref = useRef<T>();
diff --git a/src/shared/hooks/useDocumentContext.ts b/src/shared/hooks/useDocumentContext.ts
index 89404f941..428ea9ba0 100644
--- a/src/shared/hooks/useDocumentContext.ts
+++ b/src/shared/hooks/useDocumentContext.ts
@@ -1,6 +1,6 @@
 import { useContext } from 'react';
 
-import DocumentContext from '../../DocumentContext';
+import DocumentContext from '../../DocumentContext.js';
 
 export default function useDocumentContext() {
   return useContext(DocumentContext);
diff --git a/src/shared/hooks/useOutlineContext.ts b/src/shared/hooks/useOutlineContext.ts
index 89157deaf..8ea2877fb 100644
--- a/src/shared/hooks/useOutlineContext.ts
+++ b/src/shared/hooks/useOutlineContext.ts
@@ -1,6 +1,6 @@
 import { useContext } from 'react';
 
-import OutlineContext from '../../OutlineContext';
+import OutlineContext from '../../OutlineContext.js';
 
 export default function useOutlineContext() {
   return useContext(OutlineContext);
diff --git a/src/shared/hooks/usePageContext.ts b/src/shared/hooks/usePageContext.ts
index 0a2181f42..dc7e86087 100644
--- a/src/shared/hooks/usePageContext.ts
+++ b/src/shared/hooks/usePageContext.ts
@@ -1,6 +1,6 @@
 import { useContext } from 'react';
 
-import PageContext from '../../PageContext';
+import PageContext from '../../PageContext.js';
 
 export default function usePageContext() {
   return useContext(PageContext);
diff --git a/src/shared/propTypes.ts b/src/shared/propTypes.ts
index 7e621caed..5a1ff5bf8 100644
--- a/src/shared/propTypes.ts
+++ b/src/shared/propTypes.ts
@@ -2,9 +2,9 @@ import PropTypes from 'prop-types';
 import { allEvents } from 'make-event-props';
 import { PDFDataRangeTransport } from 'pdfjs-dist';
 
-import { isDefined } from './utils';
+import { isDefined } from './utils.js';
 
-import LinkService from '../LinkService';
+import LinkService from '../LinkService.js';
 
 import type { Validator } from 'prop-types';
 
diff --git a/src/shared/structTreeUtils.ts b/src/shared/structTreeUtils.ts
index c04a9aa1c..7dae122ba 100644
--- a/src/shared/structTreeUtils.ts
+++ b/src/shared/structTreeUtils.ts
@@ -1,7 +1,7 @@
-import { HEADING_PATTERN, PDF_ROLE_TO_HTML_ROLE } from './constants';
+import { HEADING_PATTERN, PDF_ROLE_TO_HTML_ROLE } from './constants.js';
 
-import type { StructTreeContent, StructTreeNode } from 'pdfjs-dist/types/src/display/api';
-import type { StructTreeNodeWithExtraAttributes } from './types';
+import type { StructTreeContent, StructTreeNode } from 'pdfjs-dist/types/src/display/api.js';
+import type { StructTreeNodeWithExtraAttributes } from './types.js';
 
 type PdfRole = keyof typeof PDF_ROLE_TO_HTML_ROLE;
 
diff --git a/src/shared/types.ts b/src/shared/types.ts
index 32694e259..c146ec409 100644
--- a/src/shared/types.ts
+++ b/src/shared/types.ts
@@ -11,9 +11,9 @@ import type {
   StructTreeNode,
   TextContent,
   TextItem,
-} from 'pdfjs-dist/types/src/display/api';
-import type { AnnotationLayerParameters } from 'pdfjs-dist/types/src/display/annotation_layer';
-import type LinkService from '../LinkService';
+} from 'pdfjs-dist/types/src/display/api.js';
+import type { AnnotationLayerParameters } from 'pdfjs-dist/types/src/display/annotation_layer.js';
+import type LinkService from '../LinkService.js';
 
 type NullableObject<T extends object> = { [P in keyof T]: T[P] | null };
 
diff --git a/src/shared/utils.spec.ts b/src/shared/utils.spec.ts
index 75f4a7014..b214ec1b2 100644
--- a/src/shared/utils.spec.ts
+++ b/src/shared/utils.spec.ts
@@ -1,5 +1,5 @@
 import { describe, expect, it } from 'vitest';
-import { isDataURI, dataURItoByteString } from './utils';
+import { isDataURI, dataURItoByteString } from './utils.js';
 
 describe('isDataURI()', () => {
   it.each`
diff --git a/src/shared/utils.ts b/src/shared/utils.ts
index 8d070d28f..5e5f660ac 100644
--- a/src/shared/utils.ts
+++ b/src/shared/utils.ts
@@ -2,7 +2,7 @@ import invariant from 'tiny-invariant';
 import warning from 'tiny-warning';
 
 import type { PDFPageProxy } from 'pdfjs-dist';
-import type { PageCallback } from './types';
+import type { PageCallback } from './types.js';
 
 /**
  * Checks if we're running in a browser environment.
diff --git a/test/AnnotationOptions.tsx b/test/AnnotationOptions.tsx
index e2df9be5e..22891efdc 100644
--- a/test/AnnotationOptions.tsx
+++ b/test/AnnotationOptions.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 
-import type { ExternalLinkTarget } from './shared/types';
+import type { ExternalLinkTarget } from './shared/types.js';
 
 type AnnotationOptionsProps = {
   externalLinkTarget: ExternalLinkTarget | undefined;
diff --git a/test/CustomRenderer.tsx b/test/CustomRenderer.tsx
index 5fc74ce31..190a30a71 100644
--- a/test/CustomRenderer.tsx
+++ b/test/CustomRenderer.tsx
@@ -2,7 +2,7 @@ import React, { useEffect, useMemo, useRef } from 'react';
 import invariant from 'tiny-invariant';
 import { usePageContext } from 'react-pdf/src';
 
-import type { RenderParameters } from 'pdfjs-dist/types/src/display/api';
+import type { RenderParameters } from 'pdfjs-dist/types/src/display/api.js';
 
 export default function CustomRenderer() {
   const pageContext = usePageContext();
diff --git a/test/LoadingOptions.tsx b/test/LoadingOptions.tsx
index 6fdf42343..31e0da11f 100644
--- a/test/LoadingOptions.tsx
+++ b/test/LoadingOptions.tsx
@@ -1,8 +1,8 @@
 import React, { useRef } from 'react';
 
-import samplePDF from './test.pdf';
+import samplePDF from './test.pdf.js';
 
-import type { File } from './shared/types';
+import type { File } from './shared/types.js';
 
 type LoadingOptionsProps = {
   file: File | null;
diff --git a/test/PassingOptions.tsx b/test/PassingOptions.tsx
index f23a6c0cb..1bc5086bb 100644
--- a/test/PassingOptions.tsx
+++ b/test/PassingOptions.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 
-import { isDataURI } from './shared/utils';
+import { isDataURI } from './shared/utils.js';
 
-import type { File, PassMethod } from './shared/types';
+import type { File, PassMethod } from './shared/types.js';
 
 type PassingOptionsProps = {
   file: File | null;
diff --git a/test/Test.tsx b/test/Test.tsx
index 4adbecf08..f65f7a181 100644
--- a/test/Test.tsx
+++ b/test/Test.tsx
@@ -1,22 +1,22 @@
 import React, { useCallback, useEffect, useState } from 'react';
 import { PDFDataRangeTransport } from 'pdfjs-dist';
-import { pdfjs, Document, Outline, Page, Thumbnail } from 'react-pdf/src';
-import 'react-pdf/src/Page/AnnotationLayer.css';
-import 'react-pdf/src/Page/TextLayer.css';
+import { pdfjs, Document, Outline, Page, Thumbnail } from 'react-pdf';
+import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
+import 'react-pdf/dist/esm/Page/TextLayer.css';
 
 import './Test.css';
 
-import AnnotationOptions from './AnnotationOptions';
-import LayerOptions from './LayerOptions';
-import LoadingOptions from './LoadingOptions';
-import PassingOptions from './PassingOptions';
-import ViewOptions from './ViewOptions';
-import CustomRenderer from './CustomRenderer';
+import AnnotationOptions from './AnnotationOptions.js';
+import LayerOptions from './LayerOptions.js';
+import LoadingOptions from './LoadingOptions.js';
+import PassingOptions from './PassingOptions.js';
+import ViewOptions from './ViewOptions.js';
+import CustomRenderer from './CustomRenderer.js';
 
-import { isArrayBuffer, isBlob, isBrowser, loadFromFile, dataURItoBlob } from './shared/utils';
+import { isArrayBuffer, isBlob, isBrowser, loadFromFile, dataURItoBlob } from './shared/utils.js';
 
 import type { PDFDocumentProxy, PDFPageProxy } from 'pdfjs-dist';
-import type { ExternalLinkTarget, File, PassMethod, RenderMode } from './shared/types';
+import type { ExternalLinkTarget, File, PassMethod, RenderMode } from './shared/types.js';
 
 pdfjs.GlobalWorkerOptions.workerSrc = new URL(
   'pdfjs-dist/build/pdf.worker.min.js',
diff --git a/test/ViewOptions.tsx b/test/ViewOptions.tsx
index b0ed454ef..00cfdc87a 100644
--- a/test/ViewOptions.tsx
+++ b/test/ViewOptions.tsx
@@ -1,6 +1,6 @@
 import React, { useRef } from 'react';
 
-import type { RenderMode } from './shared/types';
+import type { RenderMode } from './shared/types.js';
 
 type ViewOptionsProps = {
   canvasBackground?: string;
diff --git a/test/index.tsx b/test/index.tsx
index 4a67864fb..c355c5271 100644
--- a/test/index.tsx
+++ b/test/index.tsx
@@ -1,7 +1,7 @@
 import React, { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
 
-import Test from './Test';
+import Test from './Test.js';
 
 createRoot(document.getElementById('react-root') as HTMLDivElement).render(
   <StrictMode>
diff --git a/test/package.json b/test/package.json
index e8f600c65..62b7f9f3e 100644
--- a/test/package.json
+++ b/test/package.json
@@ -18,6 +18,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-pdf": "portal:../",
+    "tiny-invariant": "^1.0.0",
     "ts-node": "^10.9.1"
   },
   "devDependencies": {
diff --git a/test/shared/types.ts b/test/shared/types.ts
index 50f9f2dd6..b23ca626b 100644
--- a/test/shared/types.ts
+++ b/test/shared/types.ts
@@ -1,6 +1,6 @@
 import { PDFDataRangeTransport } from 'pdfjs-dist';
 
-import type { BinaryData } from 'pdfjs-dist/types/src/display/api';
+import type { BinaryData } from 'pdfjs-dist/types/src/display/api.js';
 
 export type Source =
   | { data: BinaryData | undefined }
diff --git a/test/yarn.lock b/test/yarn.lock
index 1f0ba0363..70342402a 100644
--- a/test/yarn.lock
+++ b/test/yarn.lock
@@ -2067,6 +2067,7 @@ __metadata:
     react: ^18.2.0
     react-dom: ^18.2.0
     react-pdf: "portal:../"
+    tiny-invariant: ^1.0.0
     ts-node: ^10.9.1
     typescript: ^5.0.0
     vite: ^4.0.0