ERROR #98123 WEBPACK

[avidsapp]

There is some error with the variables in the component's .scss files. In order to remove the error, both $button-margin and $grey-300 were added to each component that has a .scss file. Tried adding to sass/_essentials.scss file as well as via importing a custom .scss file, with no luck. Is there a better way to resolve this error?

undefined failed

width: calc(25% - #{ $button-margin });
                                       ^
Undefined variable: "$button-margin".

File: ../packages/gatsby-woocommerce-theme/src/components/wishlist/add-to-wishlist/style.scss