There are a few things to consider:
It's possible that you have not yet installed sass. If that's the case, you can do the following:
npm install sass
Make this adjustment
@import "../node_modules/bootstrap/scss/bootstrap";
$primary:#f3ced6;
to
// Custom variables
$primary:#f3ced6;
@import "../node_modules/bootstrap/scss/bootstrap";
Instead of adding variables after importing Bootstrap, include them at the top. I usually create a separate file for this purpose and write:
// Custom variables
@import "../scss/variables";
// Bootstrap core
@import "node_modules/bootstrap/scss/bootstrap";
Also, create a file named _variables.scss
to house your Bootstrap variables as usual.
To customize the colors, you can override the theme colors like so:
$theme-colors: (
"primary": $primary,
"secondary": $secondary,
"success": $success,
"info": $info,
"warning": $warning,
"danger": $danger,
"light": $light,
"dark": $dark
);
You have the option to change "primary": $primary,
to "primary": #f3ced6,
or you can utilize $primary:#f3ced6;
(ensure this is at the top).