Webpack is not resolving node_modules specified in resolve.modules property.

[Qualphey]

Bug report

Webpack is not resolving node_modules specified in resolve.modules property.

Steps to reproduce:

1. Set up a script that uses webpack API to bundle javascript.
2. Use resolve.modules config option to specify local modules path.
3. Install the script globally to be able to run it executing a command.
4. Try bundling using the script.

Now even if webpack config contains:

        resolve: {
          modules: [
            "path/to/command/node_modules"
          ],
          ...
        }

The script will still fail:

ModuleNotFoundError: Module not found: Error: Can't resolve 'babel-loader' in '/home/qualphey/Development/Tests/flytests/flypack/single_ctx'
    at /home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/webpack/lib/Compilation.js:2094:28
    at /home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/webpack/lib/NormalModuleFactory.js:895:13
    at eval (eval at create (/home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:10:1)
    at /home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/webpack/lib/NormalModuleFactory.js:332:22
    at eval (eval at create (/home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at /home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/webpack/lib/NormalModuleFactory.js:630:15
    at /home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/webpack/lib/NormalModuleFactory.js:151:11
    at /home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/webpack/lib/NormalModuleFactory.js:706:8
    at /home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/neo-async/async.js:2830:7
    at done (/home/qualphey/Development/Packages/twigs/cli/flypack/node_modules/neo-async/async.js:2925:13

This is mostly how my configuration looks like, despite the fact extra resolve.modules properties are not there.

Expected behaviour is all dependencies getting resolved and script bundled.

webpack version: 5.91.0
Node.js version: v21.7.1
Operating System: Arch Linux

[alexander-akait]

Please use ["...", "path/to/command/node_modules"]

[Qualphey]

What is "..." supposed to do? I've added it to the modules array like you suggested, but the same issue persisted.

[alexander-akait]

It means - extends default value of resolve.modules, if it will not help please create reproducible test repo, wy do you want to change this value?

Install the script globally to be able to run it executing a command

What does it mean?

[Qualphey]

Install the script globally to be able to run it executing a command
It means that you create a symlink to the script (also chmod +x ...) in one of the $PATH directories. In my case it's /home/qualphey/.local/bin.

The thing is I'm working in a bit of a custom and unusual setup.. I'll try to explain:

1. There's a zunzun npm package that I've written, which is the base package for my application development framework. It provides three main commands: zunsrv, zuncli and twigs. More info here.
2. zuncli is a command line script runner. It's main purpose is to allow developers to set up simple scripts automating workflows.
3. I've set up a script called flypack which uses less and webpack to bundle. You'd usually run the command zuncli flypack in a project directory with node_modules inside and it would read and use configuration files to determine where to find all scripts and bundle them.
4. Now I want to be able to change into any directory (that doesn't have node_modules inside nor in its ancestors) and run the same command there bundling scripts if they are in their standard relative paths with standard names.

I'm not able to do that, unless I'd add a symbolic link to path/to/flypack/node_modules within the cwd. I could automatically link it before bundling and remove it after, but this is an ugly solution as it might leave up the node_modules symlink in weird places causing even weirder issues.

Let me clarify the current modules configuration:

        resolve: {
          modules: [
            "path/to/zunzun/node_modules" // node_modules that get installed with the zunzun package
            "path/to/flypack/node_modules" // node_modules that get installed with `flypack` package
            "cwd/node_modules" // modules in current working directory. NOTE: might not exist
          ],
          ...
        }

So to wrap it all up: when you run zuncli flypack then zuncli finds and dynamically imports flypack script and then the script does it work in CWD. The problem is that I always need to have node_modules with webpack dependencies (mostly babel stuff) in CWD otherwise they don't get resolved.

Could this as well be an issue babel preset packages themselves?

Let me know if my explanation is comprehensible and what other information I should provide!
Setting up a reproducible test repository in this type of configuration would be a bit of a tough task, but if necessary I can try and set up something simple and straightforward. Otherwise please let me know if we can figure something out without me setting that repo up! :)

[Qualphey]

Check down for a link to reproduction repo.

[Qualphey]

Okay I've created a reproduction repository. I've test if the steps work. Please let me know if you get the same result:

test]$ ../script/index.mjs

Thu Apr 04 2024 16:27:56
ERROR IN: undefined
ModuleNotFoundError: Module not found: Error: Can't resolve 'babel-loader' in '/home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/test'
    at /home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/webpack/lib/Compilation.js:2094:28
    at /home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/webpack/lib/NormalModuleFactory.js:895:13
    at eval (eval at create (/home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:10:1)
    at /home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/webpack/lib/NormalModuleFactory.js:332:22
    at eval (eval at create (/home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at /home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/webpack/lib/NormalModuleFactory.js:630:15
    at /home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/webpack/lib/NormalModuleFactory.js:151:11
    at /home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/webpack/lib/NormalModuleFactory.js:706:8
    at /home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/neo-async/async.js:2830:7
    at done (/home/qualphey/Development/Tests/flytests/flypack/webpack-resolve-modules-bug-reproduction/script/node_modules/neo-async/async.js:2925:13)

[Qualphey]

I apologize for this. Turns out you can specify full paths to these modules and then they don't get resolved relative to the current working directory.

Commited a fix to my reproduction repo: https://gitlab.com/Qualphey/webpack-resolve-modules-bug-reproduction/-/commit/fe32d7c1aadfb56863fec5a6bf3d254273ecc6a5

[alexander-akait]

Yeah, if you want to reuse your logic/scripts/configurations in other projects, you need to use require.resolve (and have loaders/plugins/etc in your deps), it is not a bug of webpack, it is how node.js resoluving work, deps can hoist, so you will not resolve them in some cases, for example you will faced with it using eslint and plugins, do you need a help with something else?

[Qualphey]

No, thanks for helping!