update readme with public-hoist-pattern for yarn as package manager

[kishorchouhan]

Note pnpm requires an .npmrc file with public-hoist-pattern[]=pdfjs-dist for this to work.

Will this work if I am using yarn as package manager?
If no, then also add config needs to be done if using yarn as package manager.

[wojtekmaj]

Yarn should not require anything like that for the package to work.

[kishorchouhan]

When I added the package using yarn install react-pdf and configuring pdfjs-worker.

As the pdfjs-dist didn't get hoisted to the node_modules folder so, the pdfjs-dist/build/pdf.worker.min.js path was empty as pdfjs-dist was not present in node_modules.

Can you please help here?

I tried adding .yarnrc.yml file and adding
hoistingLimits: "pdfjs-dist": "^"
and
overrides: 'pdfjs-dist': hoist: true
but no luck.

[wojtekmaj]

Hmm... You should not need to rely on node_modules. Examples provided in react-pdf repo specifically go extra mile to ensure compatibility with, among others, Yarn PnP, at least when it comes to the scripts that copy the files manually (e.g. for Create-React-App).
Nonetheless, the option you might be looking for is called unplugging: https://yarnpkg.com/cli/unplug/

[trusktr]

Relying on node_modules like that can be useful, f.e. running a static web app and loading a worker from a URL like http://localhost:3000/node_modules/some-package/worker.js.

This is handy along with the import map standard:

<script type="importmap">{
  "imports": {
    "some-package": "/node_modules/some-package/dist/index.js"
  }
}</script>

<script type="module">
  import {something} from "some-package"

  console.log(something)
</script>

With a loader in a service worker, the following is possible too:

<script type="importmap">{
  "imports": {
    "some-package": "/node_modules/some-package/dist/index.js",
    "some-package/": "/node_modules/some-package/"
  }
}</script>

<script type="module">
  import {something} from "some-package"
  import {Worker} from "some-package/worker.js"

  const worker = new Worker()
  worker.postMessage(...)
  // ...
</script>