Upgrade Bud from 5.8.7 to 6.2.0 show error "ModuleNotFoundError: Module not found: Error: Can't resolve '../node_modules/babel-loader/lib/index.js"

After upgrade sage devDependencies from 5.87 to 6.20 i get this error when compile assets with yarn build.

[bud@6.2.0] [bud] › :heavy_multiplication_x: ModuleNotFoundError: Module not found: Error: Can’t resolve ‘/home/fabiohsouza/Colla/Projetos-Documentos/Exalt%20Sa%C3%BAde%20-%20Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/babel-loader/lib/index.js’ in ‘/home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saúde - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude’

I reinstalled the packages with
yarn add @roots/bud @roots/bud-tailwindcss @roots/sage --dev

“devDependencies”: {
@roots/bud”: “^6.2.0”,
@roots/bud-tailwindcss”: “^6.2.0”,
@roots/sage”: “^6.2.0”
}

1 Like

I’m having the same issue.

Howdy! Upgrading from Bud 5.x to Bud 6.x requires more than just bumping the Bud dependencies.

Have y’all taken a look at the upgrade guide/release notes, or referenced the Sage repo to see additional changes that you’re required to make?

1 Like

Howdy!

I hadn’t seen it

Many thanks @ben.

Hi there,
I installed a fresh new Sage 10, applied changes from [📦 improve(patch): bud@6.2.0 by kellymears · Pull Request #3074 · roots/sage · GitHub], mentioned by @ben, but the error persisted.

After renaming the project directory from “Exalt Saude - Site” to Exalt_Saude-Site (removing the spaces) the error is gone.

Log

Before:

fabiohsouza@softdev:~/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude$ yarn build
yarn run v1.22.18
$ bud build
⠦ 24% building
[bud@6.2.0] [bud] › ✖  ModuleNotFoundError: Module not found: Error: Can't resolve '/home/fabiohsouza/Colla/Projetos-Documentos/Exalt%20Saude%20-%20Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/babel-loader/lib/index.js' in '/home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude' 
    at /home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/webpack/lib/Compilation.js:2016:28
    at /home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/webpack/lib/NormalModuleFactory.js:798:13
    at eval (eval at create (/home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:10:1)
    at /home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/webpack/lib/NormalModuleFactory.js:270:22
    at eval (eval at create (/home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
    at /home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/webpack/lib/NormalModuleFactory.js:541:15
    at /home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/webpack/lib/NormalModuleFactory.js:116:11
    at /home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/webpack/lib/NormalModuleFactory.js:612:8
    at /home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/neo-async/async.js:2830:7
    at done (/home/fabiohsouza/Colla/Projetos-Documentos/Exalt Saude - Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude/node_modules/neo-async/async.js:2925:13)
Done in 2.79s.

After:

fabiohsouza@softdev:~/Colla/Projetos-Documentos/Exalt_Saude-Site/desenvolvimento/exaltsaude.com.br/exaltsaudecombr/web/app/themes/exaltsaude$ yarn build
yarn run v1.22.18
$ bud build
⠹ 98% emitting

◉  app/entry.f7fed3.css     4.97 kB    
◉  runtime.9fbec2.js        1 kB       
◉  editor/entry.0244e3.js   514 bytes  
◉  app/entry.7cfb9c.js      360 bytes  
◉  editor/entry.31d6cf.css  0 bytes    
◯  entrypoints.json         383 bytes  
◌  manifest.json            266 bytes  
◯  wordpress.json           33 bytes   
◯  images/.gitkeep.31d6cf   0 bytes    

duration  3s 957ms (429ms + 3s 528ms)  

mode        production  hash     b0b754b84149dda570a6  
@roots/bud  6.2.0       webpack  5.73.0                
node        16.14.2                                    

Done in 10.87s.
1 Like

Can confirm it’s choking on paths with a space/%20 in them, same thing was happening to me and same fix worked. 5.x.x didn’t have this issue.

Yes, I’m having the same issue here, having a space in one of the parent folders of my project made the yarn dev issuing errors of “module not found”

I have a space in a parent directory name which I can’t change because it contains about 60 other websites.

The solution was to create a new parent folder with the space written as “%20” and place a symbolic link in there to my original project folder, as suggested here: Error: Module not found on paths with a space in them

This is related to the transition to ESM we underwent in 6.x.

We can’t use require.resolve and resolvers are still behind a feature flag so we’re using import-meta-resolve. It’s a great package but it is converting spaces in the path to %20. Which makes sense, since it resolves URLs.

My proposed change is to just re-replace the spaces

I would still alias directories containing a space using the technique @fint mentioned. I can’t tell you what to do and technically spaces are valid in unix paths, but know there are open issues in the node repo related to them and you’re asking for trouble. Especially since ESM treats fs paths as URLs. As we’re seeing here.