Clever Geek Handbook

Angular 2/4: How to load css file from Assets

In my .angular-cli.json, I define this:

 "styles": [
        "node_modules/bootstrap/dist/css/bootstrap.min.css",
        "src/assets/css/main.css",
        "styles.css"
        ],

And in the assets folder I have (assets / css / *. Css) .. But when I run my application the CSS is not loading .. How can I solve this please? You can check the JPEG file in the app

enter image description here

+8


source to share


2 answers


I got the same error as soon as I started Angular 4 project

What i did is

There is no css in my assets

"assets": [
        "assets",
        "favicon.png"
      ],


And in style

"styles": [
        "../src/assets/css/main.css",
]

And then please ng serve again

Hope it helps

+8


source


Ran into this problem too, but I did it differently. I have not modified angular.json

. I imported the url in styles.css

with @import url("./app/custom-styles/custom-bootstrap.css");

, This way you don't need to reload to detect changes. And you keep styles.css

your overall styles clean.



Don't know if this is the best way, but it helped a lot for me to keep it clean.

0


source






More articles:


All Articles