How to import node_modules styles into an Angular 10 library?

Question

I am developing an Angular 10 library. This library uses Swiper JS as a dependency. My library should import css styles from Swiper.

I import Swiper styles from node_modules using the @import scss. This works well using the command ng test.

But when I make one ng build and import my local library into my application, I get an error in the javascript console. Bug says Swiper styles not found in node_modules.

How should I import css styles from a library from within node_modules into an Angular library 10?

Answer 1

Inside the archive .angular-cli.json in the project root it is possible to import the css files just by mapping each one of them in the Styles property, example of the primeng library css:

{
    ...
    "apps": [
        {
            ...,
            "styles": [
                "../node_modules/primeng/resources/primeng.min.css",
                "styles.scss"
            ],
            ...
        }
    ],
    ...
}

After that, just run the command ng build or ng serves again for the css to be compiled together with the source code