Gatsby 3.0: How can I get rid of this yarn / webpack resolver warning?
Asked Answered
H

1

9

What happened

I've just upgraded gatsby 2 -> 3.

Under the hood it now uses webpack 5 instead of 4 and now gives a dependency warning outstanding I just can't get rid of - raw-loader is installed as a dependency of both the main project and of gatsby even though it's the same version.

I've tried specifying a yarn resolution in my package.json, which looks like this:

  "resolutions": {
    "raw-loader": "4.0.2"
  },

But that doesn't seem to do anything. I've also tried:

  "resolutions": {
    "gatsby/raw-loader": "4.0.2"
  },

The full output

β ™ Caching HTML renderer compilation
<w> [webpack.cache.PackFileCacheStrategy/webpack.FileSystemInfo] Resolving 'raw-loader/dist/cjs' in /Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/loader-runner/lib for build dependencies doesn't lead to expected result '/Users/myname/source/octue/planex-site/node_modules/raw-loader/dist/cjs.js', but to '/Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/raw-loader/dist/cjs.js' instead. Resolving dependencies are ignored for this path.
<w>  at unknown 4 raw-loader/dist/cjs
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/loader-runner/lib/loadLoader.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/loader-runner/lib/loadLoader.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/loader-runner/lib/LoaderRunner.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/loader-runner/lib/LoaderRunner.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/webpack/lib/NormalModule.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/webpack/lib/NormalModule.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/webpack/lib/index.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/node_modules/webpack/lib/index.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/internal-plugins/functions/gatsby-node.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/internal-plugins/functions/gatsby-node.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/bootstrap/resolve-module-exports.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/bootstrap/resolve-module-exports.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/bootstrap/load-plugins/validate.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/bootstrap/load-plugins/validate.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/bootstrap/load-plugins/index.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/bootstrap/load-plugins/index.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/bootstrap/load-config-and-plugins.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/bootstrap/load-config-and-plugins.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/worker/child/load-config-and-plugins.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/worker/child/load-config-and-plugins.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/worker/child/index.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/worker/child/index.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby-worker/dist/index.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby-worker/dist/index.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/worker/messaging.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/worker/messaging.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/jobs/worker-messaging.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/jobs/worker-messaging.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/redux/actions/public.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/redux/actions/public.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/redux/actions/index.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/redux/actions/index.js
<w>  at file dependencies /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/webpack.config.js
<w>  at file /Users/myname/source/octue/planex-site/node_modules/gatsby/dist/utils/webpack.config.js

Output of yarn why

$ yarn why raw-loader
yarn why v1.22.10
[1/4] πŸ€”  Why do we have the module "raw-loader"...?
[2/4] 🚚  Initialising dependency graph...
[3/4] πŸ”  Finding dependency...
[4/4] 🚑  Calculating file sizes...
=> Found "[email protected]"
info Reasons this module exists
   - "gatsby" depends on it
   - Hoisted from "gatsby#raw-loader"
   - Hoisted from "@storybook#addon-docs#@storybook#builder-webpack4#raw-loader"
info Disk size without dependencies: "32KB"
info Disk size with unique dependencies: "240KB"
info Disk size with transitive dependencies: "2.92MB"
info Number of shared dependencies: 14

The question

How can I correctly configure either gatsby or my package.json or whatever to resolve this correctly?

Harar answered 3/9, 2021 at 15:39 Comment(0)
H
3

A workaround I've found is to do:

rm -rf node_modules/gatsby/node_modules/raw-loader

...which obviously forces node to find just the single dependency at the top of the tree. That gets rid of the annoying warning messages but I'd really like to resolve this properly.

EDIT

A closely-related issue on gatsby's github that I worked through enabled me to remove this, because it's related to webpack dependencies. Although, the solution requires a resolution of compatible gatsby and webpack so either way you have to actually provide a resolution.

Harar answered 3/9, 2021 at 15:47 Comment(4)
Did you find a better solution eventually, or is this it? :) Thanks! – Osterhus
@Osterhus I've edited the enswer with a link to the issue that allowed me to get around this particular resolution, although it's not really that much better. Also you can look at my site repo which no longer suffers from this issue – Harar
Perfect, thank you! – Osterhus
the related issue fix these warning messages!! – Tomato

© 2022 - 2024 β€” McMap. All rights reserved.