Postcss warnings with ~ font paths relative to node_modules after upgrading from 1.5.0 to 1.6.0 #8781

ghost · 2017-12-07T10:48:46Z

Versions

Angular CLI: 1.6.0
Node: 8.7.0
OS: darwin x64
Angular: 5.1.0
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

@angular/cli: 1.6.0
@angular-devkit/build-optimizer: 0.0.35
@angular-devkit/core: 0.0.22
@angular-devkit/schematics: 0.0.41
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.0
@schematics/angular: 0.1.10
@schematics/schematics: 0.0.10
typescript: 2.5.3
webpack: 3.10.0

Repro steps

In order to load font-awesome fonts, I am using the method described in #1463. In styles.css, I have added:

$fa-font-path: "~font-awesome/font";
@import "~font-awesome/scss/font-awesome";

Observed behavior

Since upgrading to angular-cli 1.6.0 I am getting warnings from postcss-url that the font files used by font-awesome cannot be found:

WARNING in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/styles.scss
(Emitted value instead of an instance of Error) postcss-url: /Users/myuser/workspace/my-frontend-ng/src/styles.scss:10:3: Can't read file '/Users/myuser/workspace/my-frontend-ng/src/~font-awesome/fonts/fontawesome-webfont.eot', ignoring
NonErrorEmittedError: (Emitted value instead of an instance of Error) postcss-url: /Users/myuser/workspace/my-frontend-ng/src/styles.scss:10:3: Can't read file '/Users/myuser/workspace/my-frontend-ng/src/~font-awesome/fonts/fontawesome-webfont.eot', ignoring
    at Object.emitWarning (/Users/myuser/workspace/my-frontend-ng/node_modules/webpack/lib/NormalModule.js:117:16)
    at result.warnings.forEach (/Users/myuser/workspace/my-frontend-ng/node_modules/postcss-loader/lib/index.js:149:49)
    at Array.forEach (<anonymous>)
    at postcss.process.then (/Users/myuser/workspace/my-frontend-ng/node_modules/postcss-loader/lib/index.js:149:27)
    at <anonymous>
 @ ./src/styles.scss 4:14-191
 @ multi ./src/styles.scss

I am getting this error for all 4 types of fonts that font-awesome uses (.eot/.ttf/.woff/woff2).

I assume this is postcss trying to inline etc. and then not finding the files due to the ~ in the path. From what I can see, postcss-url not finding the files does not seem to affect the build result, they get required and loaded just fine.

Desired behavior

No warnings :)

The text was updated successfully, but these errors were encountered:

joostme · 2017-12-07T14:16:43Z

We also had this warning when upgrading to Angular CLI 1.6.0 today.

A workaround we found is making the path include node_modules because it tries to resolve the path relative to the src folder

So this
$fa-font-path: "~font-awesome/font";

becomes this

$fa-font-path: "../node_modules/font-awesome/font";

clydin · 2017-12-08T00:18:56Z

The use of the tilde is webpack specific and while this should work for the foreseeable future, it may not always. The suggested change provided by @jozlnr may therefore be prudent.

paesku · 2017-12-08T10:16:33Z

Moving the files to your .angular-cli.json styles property might be the better solution.

GeorgeKnap · 2017-12-08T13:45:25Z

I can confirm the relative paths works. All warnings are gone.

What puzzles me though is the angular CLI recognizes src/styles as a some kind of root path thus no matter where I use the import the relative path to node modules looks like ../../node_modules/.
Not sure where CLI got the src/styles root. I'm not setting that anywhere.

clydin · 2017-12-08T19:11:01Z

With the way the sass-loader and webpack work, the top level (referenced in .angular-cli.json) file's containing directory becomes the path for all the imported files and the base for any relative resources.

So what @paesku recommended would work in this situation and would definitely be a cleaner option here as the font path wouldn't need to be set. However, if any other scss variables needed to be set before the import than that wouldn't be an option.

sinedied · 2017-12-11T13:41:47Z

@jozlnr @clydin The workaround works only for simpler cases: as you changes to a relative path, if the file containing the variable definition is imported elsewhere in the project, it breaks with errors.

In my case it's defined in theme/theme-variables.scss with other variables, and imported in components like app/home/home.scss and thus breaks the build because for some reason it tries to resolve the path from the file path making the import.

Like this:

ERROR in Error: Child compilation failed:
Module not found: Error: Can't resolve '../node_modules/ionic-angular/fonts/noto-sans-bold.ttf' in '/Users/noda/github/ngx-starter-kit/src/app/core/shell':
Error: Can't resolve '../node_modules/ionic-angular/fonts/noto-sans-bold.ttf' in '/Users/noda/github/ngx-starter-kit/src/app/core/shell'
Module not found: Error: Can't resolve '../node_modules/ionic-angular/fonts/noto-sans-bold.woff' in '/Users/noda/github/ngx-starter-kit/src/app/core/shell':
Error: Can't resolve '../node_modules/ionic-angular/fonts/noto-sans-bold.woff' in '/Users/noda/github/ngx-starter-kit/src/app/core/shell'
Module not found: Error: Can't resolve '../node_modules/ionic-angular/fonts/noto-sans-regular.ttf' in '/Users/noda/github/ngx-starter-kit/src/app/core/shell':
Error: Can't resolve '../node_modules/ionic-angular/fonts/noto-sans-regular.ttf' in '/Users/noda/github/ngx-starter-kit/src/app/core/shell'
Module not found: Error: Can't resolve '../node_modules/ionic-angular/fonts/noto-sans-regular.woff' in '/Users/noda/github/ngx-starter-kit/src/app/core/shell':
Error: Can't resolve '../node_modules/ionic-angular/fonts/noto-sans-regular.woff' in '/Users/noda/github/ngx-starter-kit/src/app/core/shell'
...

If you have ideas...

See angular/angular-cli#8781

Bidthedog · 2017-12-19T19:33:30Z

I received this today too. Downgraded to cli 1.5.5 and updated my package.json, which sorted the problem. I have a vast selection of scss files using includes and paths using ~, so using relative paths causes me more problems - doesn't seem to solve the issues for me either way.

Won't be upgrading until these warnings go away - can't discern real errors / warnings from this nonsense.

emazv72 · 2017-12-20T10:03:00Z

The workaround suggested by @jozlnr doesn't seem to work in more complex scenarios like a main styles.scss setting variables and importing bootstrap-sass.

yogeshgadge · 2018-01-02T17:15:58Z

Still broken in 1.6.3 ...here is where it is reproduced
https://github.com/yogeshgadge/demo-app2

Steps to reproduce:
npm install
Just do npm run build with version 1.6.3

yogeshgadge · 2018-01-02T17:17:17Z

Still broken. Check #8791

clydin · 2018-01-02T17:50:25Z

@yogeshgadge This issue has to do with a url() containing a tilde not an import. Either way, it is generally not recommended to use a tilde if possible as it is webpack specific.

@sinedied from the error output it appears that the imported file is defining a font. So for each component with that imported file, the font is being defined and setup again. It may be cleaner to do font setup once in the global stylesheet (unless the font is only ever used in one component).

yogeshgadge · 2018-01-02T18:49:03Z

There is no tilde in the font url.

…

On Tue, Jan 2, 2018, 12:50 PM clydin ***@***.***> wrote: @yogeshgadge <https://github.com/yogeshgadge> This issue has to do with a url() containing a tilde not an import. Either way, it is generally not recommended to use a tilde if possible as it is webpack specific. @sinedied <https://github.com/sinedied> from the error output it appears that the imported file is defining a font. So for each component with that imported file, the font is being defined and setup again. It may be cleaner to do font setup once in the global stylesheet (unless the font is only ever used in one component). — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#8781 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ACT7OPnZsWif0Xk3GhY0du55ZtQB0_bzks5tGmx5gaJpZM4Q5WKM> .

Elastep · 2018-01-02T22:10:20Z

Still not fixed in 1.6.3...
Reopen and fix please...

vehansayvazi · 2018-01-03T22:16:31Z

1.6.3 fixed this issue for me

Jelencro · 2018-01-04T08:35:42Z

I'm still getting warnings on 1.6.3

dieterp1 · 2018-01-05T14:22:02Z

I'm getting this because of an path in an Variable definitionen:

Version 1.5.3 was OK
$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/";

For version 1.6.3 I must change this to:
$icon-font-path: "../node_modules/bootstrap-sass/assets/fonts/bootstrap/";

Please reopen the issue and review this, so tilde is working again.

sinedied · 2018-01-08T20:30:09Z

1.6.3 seems to have fixed it for me, but only on OSX and Linux.

On Windows, the build now breaks completely, due to improper paths, the errors go like this (followed by many similar ones):

Module not found: Error: Can't resolve './C:nodetestnode_modulesionic-angular�ontsnoto-sans-bold.woff' in 'C:\node\test\src\app\core\shell'

Seems like the paths were not concatenated in a portable way by path.join() somewhere, and this is really bad!

chris93983 · 2018-01-09T11:57:27Z

For 1.6.3 I have same problem on Windows, and it works on Ubuntu.

sinedied · 2018-01-10T08:10:13Z

This issue should really be reopened @clydin:
Here are more tests results:

1.6.3 on OSX or Linux: no warnings, builds fine
1.6.3 on Windows (exact same projects than with OSX/Linux, tried with different ones): warnings are still there, and builds breaks badly (everything fine with 1.5.*), here is the complete error (omitted the warnings):


ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss
Module not found: Error: Can't resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot' in 'C:\projects\generator-ngx-rocket\sample-app\src'
resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot' in 'C:\projects\generator-ngx-rocket\sample-app\src'
  using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src/C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot.js doesn't exist
      as directory
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot doesn't exist
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot.ts]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot.js]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss 7:193037-193157
 @ ./src/main.scss
 @ multi ./src/main.scss
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss
Module not found: Error: Can't resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
  using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src/C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot.js doesn't exist
      as directory
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot doesn't exist
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot.ts]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot.js]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.eot]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss 7:192878-193006
 @ ./src/main.scss
 @ multi ./src/main.scss
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss
Module not found: Error: Can't resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
  using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src/C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg.js doesn't exist
      as directory
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg doesn't exist
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg.ts]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg.js]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.svg]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss 7:193737-193865
 @ ./src/main.scss
 @ multi ./src/main.scss
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss
Module not found: Error: Can't resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
  using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src/C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf.js doesn't exist
      as directory
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf doesn't exist
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf.ts]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf.js]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.ttf]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss 7:193565-193693
 @ ./src/main.scss
 @ multi ./src/main.scss
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss
Module not found: Error: Can't resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
  using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src/C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2 doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2.js doesn't exist
      as directory
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2 doesn't exist
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2.ts]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2.js]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff2]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss 7:193225-193355
 @ ./src/main.scss
 @ multi ./src/main.scss
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss
Module not found: Error: Can't resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
resolve './C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff?v=4.7.0' in 'C:\projects\generator-ngx-rocket\sample-app\src'
  using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src)
    using description file: C:\projects\generator-ngx-rocket\sample-app\package.json (relative path: ./src/C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff.js doesn't exist
      as directory
        C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff doesn't exist
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff.ts]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff.js]
[C:\projects\generator-ngx-rocket\sample-app\src\C:projectsgenerator-ngx-rocketsample-appnode_modules�ont-awesome�onts�ontawesome-webfont.woff]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"precision":8,"includePaths":[]}!./src/main.scss 7:193396-193525
 @ ./src/main.scss
 @ multi ./src/main.scss
webpack: Failed to compile.

Most likely the fix have issues on Windows.

Bidthedog · 2018-01-10T13:30:17Z

1.6.3 still produces this error for me on Win 8.1. Currently doing some work converting my site to use SSR and tried to upgrade the cli:

Spikeh@Muhammad MINGW64 /f/Git/ShadowMosesWebsite/src/ShadowMoses.Web (master)
$ yarn start
yarn run v1.2.1
$ ng serve --host 0.0.0.0
** NG Live Development Server is listening on 0.0.0.0:4200, open your browser on http://localhost:4200/ **
Date: 2018-01-10T13:25:50.092Z
Hash: afd89de775544492b7eb
Time: 5348ms
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry] [rendered]
chunk {main} main.bundle.js (main) 2.93 kB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 636 bytes [initial] [rendered]
chunk {scripts} scripts.bundle.js (scripts) 877 kB [initial] [rendered]
chunk {styles} styles.bundle.js (styles) 761 kB [initial] [rendered]
chunk {vendor} vendor.bundle.js (vendor) 854 kB [initial] [rendered]

WARNING in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap"
(Emitted value instead of an instance of Error) postcss-url: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\styles.scss:259:3: Can't read file 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\Git
NonErrorEmittedError: (Emitted value instead of an instance of Error) postcss-url: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\styles.scss:259:3: Can't read file 'F:\Git\ShadowMosesWebsite\src\S
    at Object.emitWarning (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\webpack\lib\NormalModule.js:117:16)
    at result.warnings.forEach (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\postcss-loader\lib\index.js:149:49)
    at Array.forEach (<anonymous>)
    at postcss.process.then (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\postcss-loader\lib\index.js:149:27)
    at <anonymous>
 @ ./src/styles.scss 4:14-191
 @ multi ./node_modules/animate.css/animate.min.css ./src/styles.scss

WARNING in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap"
(Emitted value instead of an instance of Error) postcss-url: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\styles.scss:260:3: Can't read file 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\Git
NonErrorEmittedError: (Emitted value instead of an instance of Error) postcss-url: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\styles.scss:260:3: Can't read file 'F:\Git\ShadowMosesWebsite\src\S
    at Object.emitWarning (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\webpack\lib\NormalModule.js:117:16)
    at result.warnings.forEach (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\postcss-loader\lib\index.js:149:49)
    at Array.forEach (<anonymous>)
    at postcss.process.then (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\postcss-loader\lib\index.js:149:27)
    at <anonymous>
 @ ./src/styles.scss 4:14-191
 @ multi ./node_modules/animate.css/animate.min.css ./src/styles.scss

WARNING in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap"
(Emitted value instead of an instance of Error) postcss-url: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\styles.scss:260:3: Can't read file 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\Git
NonErrorEmittedError: (Emitted value instead of an instance of Error) postcss-url: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\styles.scss:260:3: Can't read file 'F:\Git\ShadowMosesWebsite\src\S
    at Object.emitWarning (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\webpack\lib\NormalModule.js:117:16)
    at result.warnings.forEach (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\postcss-loader\lib\index.js:149:49)
    at Array.forEach (<anonymous>)
    at postcss.process.then (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\postcss-loader\lib\index.js:149:27)
    at <anonymous>
 @ ./src/styles.scss 4:14-191
 @ multi ./node_modules/animate.css/animate.min.css ./src/styles.scss

WARNING in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap"
(Emitted value instead of an instance of Error) postcss-url: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\styles.scss:260:3: Can't read file 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\Git
NonErrorEmittedError: (Emitted value instead of an instance of Error) postcss-url: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\styles.scss:260:3: Can't read file 'F:\Git\ShadowMosesWebsite\src\S
    at Object.emitWarning (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\webpack\lib\NormalModule.js:117:16)
    at result.warnings.forEach (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\postcss-loader\lib\index.js:149:49)
    at Array.forEach (<anonymous>)
    at postcss.process.then (F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\node_modules\postcss-loader\lib\index.js:149:27)
    at <anonymous>
 @ ./src/styles.scss 4:14-191
 @ multi ./node_modules/animate.css/animate.min.css ./src/styles.scss

ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":f
Module not found: Error: Can't resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
  using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src/F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot.js doesn't exist
      as directory
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot doesn't exist
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot.ts]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot.js]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.eot]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"
 @ ./src/styles.scss
 @ multi ./node_modules/animate.css/animate.min.css ./src/styles.scss
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":f
Module not found: Error: Can't resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
  using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src/F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg.js doesn't exist
      as directory
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg doesn't exist
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg.ts]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg.js]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.svg]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"
 @ ./src/styles.scss
 @ multi ./node_modules/animate.css/animate.min.css ./src/styles.scss
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":f
Module not found: Error: Can't resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
  using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src/F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf.js doesn't exist
      as directory
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf doesn't exist
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf.ts]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf.js]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.ttf]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"
 @ ./src/styles.scss
 @ multi ./node_modules/animate.css/animate.min.css ./src/styles.scss
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":f
Module not found: Error: Can't resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
  using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src/F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff.js doesn't exist
      as directory
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff doesn't exist
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff.ts]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff.js]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"
 @ ./src/styles.scss
 @ multi ./node_modules/animate.css/animate.min.css ./src/styles.scss
ERROR in ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":f
Module not found: Error: Can't resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
resolve './F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2' in 'F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src'
  using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    Field 'browser' doesn't contain a valid alias configuration
  after using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src)
    using description file: F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\package.json (relative path: ./src/F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2)
      no extension
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2 doesn't exist
      .ts
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2.ts doesn't exist
      .js
        Field 'browser' doesn't contain a valid alias configuration
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2.js doesn't exist
      as directory
        F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2 doesn't exist
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2.ts]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2.js]
[F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web\src\F:GitShadowMosesWebsitesrcShadowMoses.Webnode_modules♂ootstrap-sass
ssets☼onts♂ootstrapglyphicons-halflings-regular.woff2]
 @ ./node_modules/css-loader?{"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"ident":"postcss","sourceMap":false}!./node_modules/sass-loader/lib/loader.js?{"sourceMap":false,"
 @ ./src/styles.scss
 @ multi ./node_modules/animate.css/animate.min.css ./src/styles.scss
ERROR in src/app/shared/tech-list/tech-list.component.ts(3,28): error TS2307: Cannot find module 'angular2-drag-scroll'.


webpack: Failed to compile.

Spikeh@Muhammad MINGW64 /f/Git/ShadowMosesWebsite/src/ShadowMoses.Web (master)
$ ng -v

    _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/

Angular CLI: 1.6.3
Node: 8.9.1
OS: win32 x64
Angular: 5.1.3
... animations, common, compiler, compiler-cli, core, forms
... http, platform-browser, platform-browser-dynamic
... platform-server, router

@angular/cli: 1.6.3
@angular-devkit/build-optimizer: 0.0.36
@angular-devkit/core: 0.0.22
@angular-devkit/schematics: 0.0.42
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.9.3
@schematics/angular: 0.1.11
@schematics/schematics: 0.0.11
typescript: 2.4.2
webpack: 3.10.0

Downgraded to 1.5.5 again and it works fine:

Spikeh@Muhammad MINGW64 /f/Git/ShadowMosesWebsite/src/ShadowMoses.Web (master)
$ npm i @angular/[email protected] --save
- [email protected] node_modules\uglifyjs-webpack-plugin\node_modules\schema-utils
[email protected] node_modules\uglifyjs-webpack-plugin\node_modules\source-map -> node_modules\uglifyjs-webpack-plugin\node_modules\uglify-es\node_modules\source-map
[email protected] F:\Git\ShadowMosesWebsite\src\ShadowMoses.Web
`-- @angular/[email protected]
  +-- @ngtools/[email protected]
  +-- [email protected]
  +-- [email protected]
  +-- [email protected]
  +-- [email protected]
  `-- [email protected]
    +-- [email protected]
    | +-- [email protected]
    | `-- [email protected]
    `-- [email protected]
      `-- [email protected]
        +-- [email protected]
        `-- [email protected]

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

Spikeh@Muhammad MINGW64 /f/Git/ShadowMosesWebsite/src/ShadowMoses.Web (master)
$ yarn start
yarn run v1.2.1
warning package.json: "dependencies" has dependency "@angular/cli" with range "^1.5.5" that collides with a dependency in "devDependencies" of the same name with version "1.5.5"
$ ng serve --host 0.0.0.0
** NG Live Development Server is listening on 0.0.0.0:4200, open your browser on http://localhost:4200/ **
Date: 2018-01-10T13:28:25.084Z
Hash: 2987400c50e3b40fb398
Time: 9761ms
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry]
chunk {main} main.bundle.js (main) 2.29 MB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 613 kB [initial] [rendered]
chunk {styles} styles.bundle.js (styles) 767 kB [initial]
chunk {vendor} vendor.bundle.js (vendor) 11.8 MB [initial] [rendered]

webpack: Compiled successfully.

JPtenBerge · 2018-01-26T13:39:38Z

I ran into the same error when including a custom font that had spaces in the filename: Can't read file [filename]. Removed the spaces and everything worked again.

mautematico · 2018-02-09T03:45:40Z

Having this same issue with @angular/cli 1.6.8 on Debian GNU/Linux (testing)

haticesebli · 2019-03-13T10:42:12Z

I am using Angular Universal mode in my project.When i run the project with normal mode ,everthing is right,no error with "src: url('/src/assets/font/BrandonText-Light.otf') format('opentype');". but when trying to run with server side rendering mode ,it doesn't see fonts.
Can you please help?

angular-automatic-lock-bot · 2021-06-03T08:37:19Z

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.}

Brocco assigned clydin Dec 7, 2017

Brocco added the severity2: inconvenient label Dec 7, 2017

clydin mentioned this issue Dec 7, 2017

fix(@angular/cli): support inlining stylesheet resource tilde paths #8791

Merged

sinedied mentioned this issue Dec 11, 2017

Update to Angular CLI 1.6 and TypeScript 2.5 ngx-rocket/generator-ngx-rocket#200

Closed

sinedied added a commit to ngx-rocket/generator-ngx-rocket that referenced this issue Dec 11, 2017

Fixed font awesome fonts path for [email protected]

49d51b3

See angular/angular-cli#8781

filipesilva closed this as completed in #8791 Dec 21, 2017

sinedied mentioned this issue Jan 10, 2018

Build breaks on Windows with ~ font paths relative to node_modules (working on OSX/Linux) #9154

Closed

angular-automatic-lock-bot bot locked and limited conversation to collaborators Jun 3, 2021

clydin removed their assignment Jun 28, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Postcss warnings with ~ font paths relative to node_modules after upgrading from 1.5.0 to 1.6.0 #8781

Postcss warnings with ~ font paths relative to node_modules after upgrading from 1.5.0 to 1.6.0 #8781

ghost commented Dec 7, 2017

joostme commented Dec 7, 2017

clydin commented Dec 8, 2017

paesku commented Dec 8, 2017

GeorgeKnap commented Dec 8, 2017

clydin commented Dec 8, 2017

sinedied commented Dec 11, 2017 •

edited

Loading

Bidthedog commented Dec 19, 2017

emazv72 commented Dec 20, 2017

yogeshgadge commented Jan 2, 2018 •

edited

Loading

yogeshgadge commented Jan 2, 2018

clydin commented Jan 2, 2018

yogeshgadge commented Jan 2, 2018 via email

Elastep commented Jan 2, 2018

vehansayvazi commented Jan 3, 2018

Jelencro commented Jan 4, 2018

dieterp1 commented Jan 5, 2018

sinedied commented Jan 8, 2018 •

edited

Loading

chris93983 commented Jan 9, 2018

sinedied commented Jan 10, 2018

Bidthedog commented Jan 10, 2018 •

edited

Loading

JPtenBerge commented Jan 26, 2018 •

edited

Loading

mautematico commented Feb 9, 2018

haticesebli commented Mar 13, 2019

angular-automatic-lock-bot bot commented Jun 3, 2021

Postcss warnings with ~ font paths relative to node_modules after upgrading from 1.5.0 to 1.6.0 #8781

Postcss warnings with ~ font paths relative to node_modules after upgrading from 1.5.0 to 1.6.0 #8781

Comments

ghost commented Dec 7, 2017

Versions

Repro steps

Observed behavior

Desired behavior

joostme commented Dec 7, 2017

clydin commented Dec 8, 2017

paesku commented Dec 8, 2017

GeorgeKnap commented Dec 8, 2017

clydin commented Dec 8, 2017

sinedied commented Dec 11, 2017 • edited Loading

Bidthedog commented Dec 19, 2017

emazv72 commented Dec 20, 2017

yogeshgadge commented Jan 2, 2018 • edited Loading

yogeshgadge commented Jan 2, 2018

clydin commented Jan 2, 2018

yogeshgadge commented Jan 2, 2018 via email

Elastep commented Jan 2, 2018

vehansayvazi commented Jan 3, 2018

Jelencro commented Jan 4, 2018

dieterp1 commented Jan 5, 2018

sinedied commented Jan 8, 2018 • edited Loading

chris93983 commented Jan 9, 2018

sinedied commented Jan 10, 2018

Bidthedog commented Jan 10, 2018 • edited Loading

JPtenBerge commented Jan 26, 2018 • edited Loading

mautematico commented Feb 9, 2018

haticesebli commented Mar 13, 2019

angular-automatic-lock-bot bot commented Jun 3, 2021

sinedied commented Dec 11, 2017 •

edited

Loading

yogeshgadge commented Jan 2, 2018 •

edited

Loading

sinedied commented Jan 8, 2018 •

edited

Loading

Bidthedog commented Jan 10, 2018 •

edited

Loading

JPtenBerge commented Jan 26, 2018 •

edited

Loading