Debugging `ModuleNotFoundError` encountered while running `yarn build:production`

Howdy All,

I’ve been doing some frontend on work on a Sage 9 project and we began encountering an issue that I believe I have found a resolution for… but I’m not sure why it wouldn’t be a known issue impacting others.

We’ve got some font-face declarations in css files within our assets/fonts directory. These CSS files are @import'ed in Sage’s main.scss file.

Everything has been working fine until the first time these changes hit CI, then we started seeing ModuleNotFoundError errors emitted from Webpack during the bundling process.

After messing around a bit locally, I found that the error was encountered only when running the build:production script, not during start or even the plain ole’ build.

I spent some time looking in other areas only to find that the issue was caused by the lack of sourcemaps during production builds. I don’t have a problem with dropping sourcemaps in production however the loader which handles remapping the url() attributes in the stylesheet requires sourcemaps.

Given that a built-in dependency requires sourcemaps to be enabled for production builds, I’m curious why this configuration exists and why others haven’t been encountering it.

I’m also aware that this could be a total issue of mistake on my part with my solution being only relevant to something I did in the past.

In either case, I’d love to hear if anyone else has experienced this or if there is any feedback on something else I should try.

I should note that the fix (unless something else changed) for me has been to add the following property to the object exposed in theme/resources/assets/config.json:

{
  //...
  "enabled": {
    "sourceMaps": true
  }
}
2 Likes

First: thanks for pointing to the sourcemap, i researched somewhat but didn’t get close to this resolution.
I do not have a solution, sadly, but came up with an reproducable recipie for future testing or research, possibly

composer create-project roots/sage module-not-found-error
cd module-not-found-error
yarn add typeface-fira-sans
touch resources\assets\styles\autoload\_typeface-fira-sans.scss
// xargs needed to remove whitespace (no-eol-whitespace)
echo @import "~typeface-fira-sans/index"; | xargs >> resources\assets\styles\autoload\_typeface-fira-sans.scss
yarn && yarn run build:production --verbose

again, your solution works fine, and i don’t mind pushing the maps either or instructing the CI script to remove them is feasible, but feels a bit wrong… somewhat

@eransch I came up against this same issue. I’m running Version 9.0.5 and couldn’t figure out why after adding @font-face to my SCSS and referencing the font files locally that yarn build:production didn’t compile the fonts (worked fine with yarn start & yarn build). Has there been any more info regarding this since you posted? It looks like quite an old issue… Anyway thanks so much for the info :smiley: