andhika.sw
andhika.sw

Reputation: 191

Angular 4 failed to load scss after adding a component

I got an error like this in my Angular 4 web app.

Error message

It was happened after I generated a upload-button component using cli, copy-&-pasted some code from other component's html & scss file to upload-button.component.html and upload-button.component.scss and the error suddenly appears in my browser console with all my app blank with just plain white screen. I didn't even touch any of .ts file since then.

The error says the app cannot load my newly made component's scss, but when I look up into Sources panel, the component is loaded into the browser completely.

enter image description here

I have already deleted the component, even created a new project and copied all of src/app content into the same path on new project, but the message still appears.

Here is my Angular version

Angular CLI: 1.5.2
Node: 7.9.0
OS: darwin x64
Angular: 5.0.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

p.s. I didn't change any of Webpack configuration or else.

Please advise.

Upvotes: 0

Views: 1022

Answers (2)

andhika.sw
andhika.sw

Reputation: 191

After rechecked all the component, I found a misplaced <link href="..."> in one of the component. I'm not sure how it was there but I'm glad that the app working back again.

Upvotes: 1

Joshua Fabillar
Joshua Fabillar

Reputation: 496

check if your StyleUrls is loading correctly.

@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.scss']
})

Upvotes: 0

Related Questions