Getting error in import of the @import '~material-design-icons-iconfont/src/material-design-icons';

[vaishnavravi33]

Getting error in import of the @import '~material-design-icons-iconfont/src/material-design-icons'; in angular 16.
This import was working in angular 13 but after migration from angular 13 to v16 import the icons giving error.

Error: "Module build failed (from ./node_modules/sass-loader/dist/cjs.js): Can't find stylesheet to import."

Request to help in this.

My Environment is as below:

[alaindeurveilher]

Have a similar issue after migrating to Angular v17, and after adding Native Federation to the project:

X [ERROR] No loader is configured for ".eot" files: node_modules/material-design-icons-iconfont/dist/fonts/MaterialIcons-Regular.eot

    node_modules/material-design-icons-iconfont/dist/material-design-icons.css:7:11:
      7 │   src: url("./fonts/MaterialIcons-Regular.eot");
        ╵            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

1 of 7 errors shown (disable the message limit with --log-limit=0)
 ERR!  Error bundling shared npm package 
 ERR!  Build failed with 7 errors:
 ERR!  node_modules/@angular/flex-layout/fesm2020/angular-flex-layout-server.mjs:4:38: ERROR: Could not resolve "@angular/platform-server"
 ERR!  node_modules/material-design-icons-iconfont/dist/material-design-icons.css:7:11: ERROR: No loader is configured for ".eot" files: node_modules/material-design-icons-iconfont/dist/fonts/MaterialIcons-Regular.eot
 ERR!  node_modules/material-design-icons-iconfont/dist/material-design-icons.css:9:25: ERROR: No loader is configured for ".woff2" files: node_modules/material-design-icons-iconfont/dist/fonts/MaterialIcons-Regular.woff2
 ERR!  node_modules/material-design-icons-iconfont/dist/material-design-icons.css:9:85: ERROR: No loader is configured for ".woff" files: node_modules/material-design-icons-iconfont/dist/fonts/MaterialIcons-Regular.woff
 ERR!  node_modules/material-design-icons-iconfont/dist/material-design-icons.css:9:143: ERROR: No loader is configured for ".ttf" files: node_modules/material-design-icons-iconfont/dist/fonts/MaterialIcons-Regular.ttf
 ERR!  ...

[wtbrannock]

Was able to get our application running again with this configuration modification

package.json
"material-design-icons-iconfont": "6.7.0",

angular.json
"stylePreprocessorOptions": {
"includePaths": [
"node_modules/material-design-icons-iconfont",

app.scss
@import 'src/material-design-icons.scss';