Module Error (Emitted value instead of an instance of Error)

I received similar error while building an Angular CLI application after upgrading the application from Angular 8 to Angular 10. A component was using an scss file that had a path to an image in the assets folder (e.g. assets/images/test.jpg). This path to the image worked in Angular 8 (e.g. assets/images/test.jpg) but did not work after the upgrade. The build will break with the following error as it was looking for the image file relative to the current directory the component was in. The file would not display on the page also. I changed the path relative to the component's folder such as ../../../../assets/images/test.jpg that resolved the issue.

Error: (Emitted value instead of an instance of Error) CssSyntaxError: C:\myproject\my.component.scss:10:12: Can't resolve './assets/images/test.jpg'


Just added single slash / in my background:url(/../../assets) and its working as expected as per documentation it means it will look from the current path.


Replace path from this:

@font-face {
  font-family: 'Effra';
  src: url('assets/fonts/Effra_W_It.ttf') format("truetype");
  font-weight:400;
  font-style: italic;
}

To this:

@font-face {
  font-family: 'Effra';
  src: url("~assets/fonts/Effra_W_It.ttf") format("truetype");
  font-weight:400;
  font-style: italic;
}

The change in the path to file is key: ~assets/