Darken function "must be a color" error V4

Hello, I want to preface this by saying there is a ticket open on this error but only collaborators are allowed to comment on it. I just need to know if this is something that is currently in the works? or if someone can tell me if there is a work around for this or if it’s something that I’m doing wrong.

Currently I am importing my custom variables over the bootstrap.scss file like so:

// Variables
@import 'config/variables';

// Bootstrap
@import 'node_modules/bootstrap/scss/bootstrap';

This is my setup:

"bootstrap": "^4.0.0",
"laravel-mix": "^1.0"

Laravel Mix uses Webpack for those who don’t know and from the looks of it uses the latest. What I am seeing happening when trying to run yarn run dev I get a series of errors.

ERROR in ./node_modules/css-loader?{"url":true,"sourceMap":false,"importLoaders":1}!./node_modules/postcss-loader/lib?{"sourceMap":true,"ident":"postcss","plugins":[null]}!./node_modules/resolve-url-loader?{"sourceMap":true,"root":"/Users/me/project-com/SourceCode/node_modules"}!./node_modules/sass-loader/lib/loader.js?{"precision":8,"outputStyle":"expanded","sourceMap":true}!./assets/scss/app.scss
Module build failed:
$link-hover-color : darken($link-color, 15%);
                   ^
      Argument `$color` of `darken($color, $amount)` must be a color

Backtrace:
	assets/scss/config/_variables.scss:86, in function `darken`
	assets/scss/config/_variables.scss:86
      in /Users/me/project-com/SourceCode/assets/scss/config/_variables.scss (line 86, column 21)
 @ ./assets/scss/app.scss 4:14-254
 @ multi ./assets/js/app.js ./assets/scss/app.scss

ERROR in ./assets/scss/app.scss
Module build failed: ModuleBuildError: Module build failed:
$link-hover-color : darken($link-color, 15%);
                   ^
      Argument `$color` of `darken($color, $amount)` must be a color

Backtrace:
	assets/scss/config/_variables.scss:86, in function `darken`
	assets/scss/config/_variables.scss:86
      in /Users/me/project-com/SourceCode/assets/scss/config/_variables.scss (line 86, column 21)
    at runLoaders (/Users/me/project-com/SourceCode/node_modules/webpack/lib/NormalModule.js:195:19)
    at /Users/me/project-com/SourceCode/node_modules/loader-runner/lib/LoaderRunner.js:364:11
    at /Users/me/project-com/SourceCode/node_modules/loader-runner/lib/LoaderRunner.js:230:18
    at context.callback (/Users/me/project-com/SourceCode/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at Object.asyncSassJobQueue.push [as callback] (/Users/me/project-com/SourceCode/node_modules/sass-loader/lib/loader.js:55:13)
    at Object.<anonymous> (/Users/me/project-com/SourceCode/node_modules/async/dist/async.js:2257:31)
    at Object.callback (/Users/me/project-com/SourceCode/node_modules/async/dist/async.js:958:16)
    at options.error (/Users/me/project-com/SourceCode/node_modules/node-sass/lib/index.js:294:32)
 @ ./assets/scss/app.scss
 @ multi ./assets/js/app.js ./assets/scss/app.scss

[JmRy]

@andrade1379, @alireza4050 I had the same problem and error. I solved it like this:

1. Update sass compiler to 3.5.5 version
2. Insert on my code @import “…/bootstrap/scss/functions”; @import “…/bootstrap/scss/variables”;

theme-color() is a function

[XhmikosR]

The problem lies in your app.css judging by the error message, so you are passing something wrong in the darken function.

Either way, for implementation help, you should ask on StackOverflow or something.