angular-cli >= 1.0.1: File to import not found or unreadable (SCSS build error)
See original GitHub issueBug, feature request, or proposal:
BUG
What is the expected behavior?
Angular CLI/Webpack should build without giving SCSS errors.
What is the current behavior?
Getting import unreadable for import in scss file.
ERROR in ./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader?{"ident":"postcss"}!./~/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/assets/styles/custom-app-theme.scss
Module build failed:
@import '~@angular/material/theming';
^
File to import not found or unreadable: ~@angular/material/theming.
Parent style sheet: stdin
in /Users/jason/web-app/src/assets/styles/custom-app-theme.scss (line 70, column 1)
@ ./src/assets/styles/custom-app-theme.scss 4:14-216
@ multi ./src/assets/styles/ptone.scss ./src/assets/styles/custom-app-theme.scss ./~/cropperjs/dist/cropper.css ./src/assets/styles/pace.css ./~/prismjs/themes/prism-okaidia.css ./src/styles.scss
webpack: Failed to compile.
What are the steps to reproduce?
Try to build project with custom material2 theme (importing ~@angular/material/theming) with angular-cli version >= 1.0.1.
Which versions of Angular, Material, OS, browsers are affected?
Angular 4.1.1 Angular-cli 1.0.1, 1.0.2 Material 2.0.0-beta.3
Is there anything else we should know?
Posting this here as well as in the angular/material2 repo https://github.com/angular/material2/issues/4449. This seems like it is most likely an issue with angular-cli and whatever new scss processors were added in version 1.0.1.
Issue Analytics
- State:
- Created 6 years ago
- Reactions:8
- Comments:5 (2 by maintainers)
Top Results From Across the Web
Angular 4 + Material 2 SASS compile error "File to import not ...
I solve preceding issue like following. First step: Create customTheme.scss in src directory. @import '.
Read more >Angular 4 + Material 2 SASS compile error “File to import not ...
I solve preceding issue like following. First step: Create customTheme.scss in src directory. ... Important: import statement depends to angular material version ...
Read more >npm install for Angular version - Material Design for Bootstrap
angular -bootstrap-md/scss/mdb.scss Module build failed: @import bootstrap/functions; ^ File to import not found or unreadable: bootstrap/functions.
Read more >Zurb foundation With Angular CLI | Sherman Digital
In the _settings.scss file, find the line with @import 'util/util'; and change it to point to the proper directory: @ ...
Read more >sass error : file to import not found or unreadable | Ionic Forums
I was trying to develop an app using ionic 3 , cordova 7 and angular. What I was getting ? ... Why I...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
This is caused by an issue with the release today of sass-loader 6.0.4. It appears that a fix is in progress for the issue and hopefully a new release will be available soon.
As a temporary workaround until then you can pin the version to 6.0.3 via:
npm i -DE sass-loader@6.0.3
UPDATE: 6.0.5 has been released. The above temporary workaround is no longer needed.
This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.
Read more about our automatic conversation locking policy.
This action has been performed automatically by a bot.