no ResourceLoader implementation has been provided

I’m submitting a … (check one with “x”)

[x] bug report => check the README and search github for a similar issue or PR before submitting
[ ] support request => check the README and search github for a similar issue or PR before submitting
[ ] feature request

Current behavior

Got this error when running server Error: No ResourceLoader implementation has been provided. Can't read the url "../../assets/colors"

I have some sass files using @import

Expected/desired behavior

No error at all

Minimal reproduction of the problem with instructions

Just add a scss file and trying to import another scss file.

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 4.1.X

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript 2.3.2 | ES6/7 | ES5]

• Node (for AoT issues): node --version = 7.6.0

Thank you and feel free to ask any further question.

[ennyta]

I managed to fix it. In webpack.common.js add this part: { test: /.scss$/, exclude: /node_modules/, loaders: [‘raw-loader’, ‘sass-loader’] // sass-loader not scss-loader }

and remove scss from this part: { test: /.(scss|html|png|jpe?g|gif|svg|woff|woff2|ttf|eot|ico)$/, use: ‘raw-loader’ }

That enables @imports in sass to be resolved and compiled.

[fulls1z3]

@paulogr @rahulbpatel @ennyta @mohitkadelongraph @ysus I was able to reproduce this error, and am going to push a fix within a couple of hours, so stay tuned guys.