Build error with 1.7.1 when using Angular Material

Versions

<!--
Angular CLI: 1.7.0
Node: 8.9.1
OS: darwin x64
Angular: 5.2.6
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router, service-worker

@angular/cdk: 5.2.2
@angular/cli: 1.7.1
@angular/flex-layout: 2.0.0-beta.12
@angular/material: 5.2.2
@angular-devkit/build-optimizer: 0.3.1
@angular-devkit/core: 0.3.1
@angular-devkit/schematics: 0.3.1
@ngtools/json-schema: 1.2.0
@ngtools/webpack: 1.10.0
@schematics/angular: 0.3.1
@schematics/package-update: 0.3.1
typescript: 2.6.2
webpack: 3.11.0
-->

Repro steps

• git clone https://github.com/ngx-rocket/generator-ngx-rocket
• npm link .
• mkdir repro && cd repro
• ngx new. Select all default options but choose “Angular Material” for the UI question
• npm run e2e

Observed behavior

With angular-cli@1.7.1 I have this error when I build a project using Angular Material:

ERROR in ./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--8-3!./src/main.scss
(Emitted value instead of an instance of Error) CssSyntaxError: /Users/noda/github/generator-ngx-app/sample/node_modules/material-design-icons/iconfont/material-icons.css:10:12: Can't resolve '../node_modules/material-design-icons/iconfont/MaterialIcons-Regular.ttf)%20format(%27truetype%27' in '/Users/noda/github/generator-ngx-app/sample/src'

   8 |        url(MaterialIcons-Regular.woff2) format('woff2'),
   9 |        url(MaterialIcons-Regular.woff) format('woff'),
> 10 |        url(MaterialIcons-Regular.ttf) format('truetype');
     |            ^
  11 | }

When reverting back to angular-cli@1.7.0 everything works perfectly.

Desired behavior

App builds correctly with angular-cli@1.7.1

[cyrilletuzi]

Same issue.

There is a serious problem in CLI management which needs to be solved.

First, it’s the third times we have a CSS regression issue in minor or patch releases, just in the last few weeks. It’s not acceptable in such an important project. Tests are clearly insufficient.

Then and most importantly, it’s not normal to have to wait so long for regressions fixes, just because the CLI team sticks to a completely inflexible and arbitrary calendar. Regressions should be fixed and new patch releases published immediately, like in any other library. I really don’t understand this way of managing Angular (and I’m not alone on this point). All process are automated so it’s easy to publish a new release.

[wartab]

Roughly the same error is happening with Devextreme icons when trying to load them using angular-cli 1.7.1. Reverting to 1.7.0 also solves this for me.

ERROR in ./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/devextreme/dist/css/dx.light.css
(Emitted value instead of an instance of Error) CssSyntaxError: C:\Users\Vincent Lycoops\projects\web-acc\node_modules\devextreme\dist\css\dx.light.css:3219:12: Can't resolve 'icons/dxicons.woff)%20format(%27woff%27),%20url(icons/dxicons.ttf)%20format(%27truetype%27' in 'C:\Users\Vincent Lycoops\projects\web-acc\node_modules\devextreme\dist\css'

  3217 | @font-face {
  3218 |   font-family: 'DXIcons';
> 3219 |   src: url(icons/dxicons.woff) format('woff'), url(icons/dxicons.ttf) format('truetype');
       |            ^
  3220 |   font-weight: normal;
  3221 |   font-style: normal;