CODEWITHSUNDEEP
htmlcssangularangular-moduleangular-library
Roka545
Roka545

Reputation: 3626

Custom Angular library not applying css styles when importing into another project

I've made an Angular library that I'm importing into an outside project. The styles I created in the original project however are not showing up when I use the library in the outside project.

Here's the layout of my project:

-> my-lib
   -> src
      -> lib
         -> components
         -> models
         -> services
         -> styles
             -> my_styles.css

In my angular.json file for this project, I've included the .css file in the styles section like:

"styles": [
   "src/lib/styles/my_styles.css"
]

After I package the project into a custom library, I import it into the outside project:

"my-lib": "file:my-lib-1.0.0.tgz"

In the outside project's angular.json within the main project I include the style sheet in the 'styles' section similar to how I did the original project:

"styles": [
   "node_modules/my-lib/styles/my_styles.css"
]

When I run this project however, the styles aren't being applied. What exactly am I doing wrong?

Upvotes: 0

Views: 5473

Answers (1)

mohamedhemeda
mohamedhemeda

Reputation: 119

simply you can add your file my_styles.css in assests folder and call it in style.css like this

@import url('./assets/my_styles.css');

Upvotes: 1

Related Questions