はじめに

React + TypescriptでPDFを表示したいと思ってreact-pdfを使用して実装した時の話にかなり困ったので、その解決策を備忘録として自分用のメモに残しておく。

インストールしたモジュール

yarn add @react-pdf-viewer/core react-pdf pdfjs-dist @react-pdf-viewer/default-layout

上記コマンドをいろいろ試してもうやりすぎて何を最初に入れたか忘れた・・・
がこの辺りをインストールすれば多分いけた・・・

pdfjsのworker設定が必要だったんだけど、これがめちゃくちゃハマった。
解決策は以下になる。

pdfjs.GlobalWorkerOptions.workerSrc = new URL("pdfjs-dist/build/pdf.worker.min.js", import.meta.url).toString();

書き方は合ってたのにセットアップでクソ苦労した・・・