question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

angular-cli >= 1.0.1: File to import not found or unreadable (SCSS build error)

See original GitHub issue

Bug, 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:closed
  • Created 6 years ago
  • Reactions:8
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

5reactions
clydincommented, May 10, 2017

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.

0reactions
angular-automatic-lock-bot[bot]commented, Sep 7, 2019

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.

Read more comments on GitHub >

github_iconTop 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 >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found