Webpacker: The resolved_paths option has been deprecated. Use additional_paths instead

Question

I bumped webpacker from 4.x to 5.2.1 and started getting this warning:

The resolved_paths option has been deprecated. Use additional_paths instead.

This seems straightforward enough, my config/webpacker.yml was almost unmodified:

  # Additional paths webpack should lookup modules
  # ['app/assets', 'engine/foo/app/assets']
  resolved_paths: [
    'app/assets',
  ]

But doing a simple s/resolved_paths/additional_paths/ there doesn't work:

[Webpacker] Compiling...
[Webpacker] Compilation failed:
Hash: 7448f36a43523a84e146
Version: webpack 4.44.1
Time: 5803ms
Built at: 10/15/2020 11:57:06 AM
                                          Asset      Size            Chunks                         Chunk Names
         js/application-a019b363e4513fe092e6.js  3.02 MiB       application  [emitted] [immutable]  application
     js/application-a019b363e4513fe092e6.js.map  3.03 MiB       application  [emitted] [dev]        application
         js/hello_react-40e806bdb6de496532d8.js  1.05 MiB       hello_react  [emitted] [immutable]  hello_react
     js/hello_react-40e806bdb6de496532d8.js.map  1.21 MiB       hello_react  [emitted] [dev]        hello_react
    js/server_rendering-9cd9dcc6e1cebb2a8063.js  2.25 MiB  server_rendering  [emitted] [immutable]  server_rendering
js/server_rendering-9cd9dcc6e1cebb2a8063.js.map  2.44 MiB  server_rendering  [emitted] [dev]        server_rendering
                                  manifest.json  1.05 KiB                    [emitted]
Entrypoint application = js/application-a019b363e4513fe092e6.js js/application-a019b363e4513fe092e6.js.map
Entrypoint hello_react = js/hello_react-40e806bdb6de496532d8.js js/hello_react-40e806bdb6de496532d8.js.map
Entrypoint server_rendering = js/server_rendering-9cd9dcc6e1cebb2a8063.js js/server_rendering-9cd9dcc6e1cebb2a8063.js.map
[./app/javascript/channels sync recursive _channel\.js$] ./app/javascript/channels sync _channel\.js$ 160 bytes {application} [built]
[./app/javascript/channels/index.js] 211 bytes {application} [built]
[./app/javascript/components sync recursive ^\.\/.*$] ./app/javascript/components sync ^\.\/.*$ 2.42 KiB {application} {server_rendering} [built]
[./app/javascript/packs/application.js] 10.3 KiB {application} [built]
[./app/javascript/packs/hello_react.jsx] 1.05 KiB {hello_react} [built]
[./app/javascript/packs/server_rendering.js] 301 bytes {server_rendering} [built]
[./node_modules/webpack/buildin/amd-options.js] (webpack)/buildin/amd-options.js 80 bytes {application} {server_rendering} [built]
[./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 905 bytes {application} {server_rendering} [built]
[./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 552 bytes {application} {server_rendering} [built]
    + 474 hidden modules

ERROR in ./app/javascript/components/menu/MenuComponent.jsx
Module not found: Error: Can't resolve 'images/ellipsis-v.svg' in '/home/me/app/javascript/components/menu'

So obviously additional_paths isn't just a drop-in replacement, even though the docs suggest it should be.

Before I jump into the source to try to understand what's happening here, anyone got a quick fix?

Outrage

Having this issue right now, did you manage to fix it? – Voltz

@OmarHussein Haven't found a fix yet, it wasn't affecting functionality so I'm just proceeding as normal, but it is very annoying. – Outrage

Here is the source of the change- looks like the difference is in how it handles globbing. But what this means for you and me, I'm not sure yet. github.com/rails/webpacker/commit/… – Pretended

You might need to update your gem as well to get it working apparently, as per github.com/rails/webpacker/issues/2705 – Pretended

Thanks @compiledweird, very interesting - I'll check it out on our codebase today. – Outrage

@Pretended - hm, bumping both versions (package.json and Gemfile) seemed to fix it. Thanks for the pointer! I thought I would have tried that originally but I guess not. Who knows! – Outrage

@OmarHussein I guess try bumping both versions at the same time? – Outrage

Answer 1

The error is logged in the web browser's console, and it comes from the npm package. You need to upgrade both: the webpacker gem and @rails/webpacker npm package.

Conner