No mixin named border-radius

I’m attempting to use the bootstrap 4 styles. We have an angular-cli projects and inside the angular-cli.json file I’ve added the following to my styles.

"styles": [ "../node_modules/bootstrap/scss/bootstrap.scss", "../node_modules/ngx-toastr/toastr-bs4-alert.scss",

For whatever reason, when I run ng build I end up getting the error message “No mixin named border-radius”. I made sure to put them in the correct order, but for whatever reason, it does not want to build properly. Any ideas?

[trevor-hackett]

In your styles.scss import bootstrap (or just bootstrap variables) then import the scss in this library.

example:

@import "~bootstrap/scss/functions";
@import "~bootstrap/scss/variables";
// or
@import "~bootstrap/scss/bootstrap";

// then import toastr scss
@import "~ngx-toastr/toastr-bs4-alert.scss";

If you don’t have styles.scss and instead just have styles.css, just rename it to styles.scss and then restart angular-cli

[RezaRahmati]

Thanks for fast response Adding @import '~bootstrap/scss/bootstrap'; solved the issue

FYI Adding functions and variables will cause the below error as well Argument '$color' of 'darken($color, $amount)' must be a color