Light
Dark
System
Ask  Question

Sass error: $color2: ... is not a color

ERROR in ./resources/assets/demo1/sass/plugins.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: $color2: var(--bs-gray-900) is not a color.
╷
212 │ @return mix(black, $color, $weight);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
node_modules/bootstrap/scss/_functions.scss 212:11 shade-color()
node_modules/bootstrap/scss/_variables.scss 1147:37 @import
resources/assets/demo1/sass/_init.scss 19:9 @import
resources/assets/demo1/sass/plugins.scss 10:9 root stylesheet
at processResult (/var/www/html/node_modules/webpack/lib/NormalModule.js:758:19)
at /var/www/html/node_modules/webpack/lib/NormalModule.js:860:5
at /var/www/html/node_modules/loader-runner/lib/LoaderRunner.js:400:11
at /var/www/html/node_modules/loader-runner/lib/LoaderRunner.js:252:18
at context.callback (/var/www/html/node_modules/loader-runner/lib/LoaderRunner.js:124:13)
at Object.loader (/var/www/html/node_modules/sass-loader/dist/index.js:69:5)

ERROR in ./resources/assets/demo1/sass/style.scss
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: $color2: var(--bs-gray-900) is not a color.
╷
212 │ @return mix(black, $color, $weight);
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
node_modules/bootstrap/scss/_functions.scss 212:11 shade-color()
node_modules/bootstrap/scss/_variables.scss 1147:37 @import
resources/assets/demo1/sass/_init.scss 19:9 @import
resources/assets/demo1/sass/style.scss 6:9 root stylesheet
at processResult (/var/www/html/node_modules/webpack/lib/NormalModule.js:758:19)
at /var/www/html/node_modules/webpack/lib/NormalModule.js:860:5
at /var/www/html/node_modules/loader-runner/lib/LoaderRunner.js:400:11
at /var/www/html/node_modules/loader-runner/lib/LoaderRunner.js:252:18
at context.callback (/var/www/html/node_modules/loader-runner/lib/LoaderRunner.js:124:13)
at Object.loader (/var/www/html/node_modules/sass-loader/dist/index.js:69:5)

2 ERRORS in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)
webpack compiled with 4 errors


getting this error when first compiling webpack, laravel_app_v8.1.7
user
technotronic flow 3 months ago
Laravel Metronic SASS
6 Answers
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (6)

F
Faizal Author3 months ago
Hi,

May I know which Laravel are you using? Laravel starterkit or Laravel app?

Thanks
user
technotronic flow 3 months ago
laravel app
J
JobiwanD 3 months ago
Hello,

I had the same issue. To fix it, I checked the version of bootstrap dependency and bumped it to 5.3.0-alpha1 in package.json. Hope it helps you.
F
Faizal Author3 months ago
Thanks, JobiwanD. This is probably the bootstrap version issue. Please try yo update the bootstrap version in package.json.

"bootstrap": "5.3.0-alpha1",



Thanks
user
technotronic flow 3 months ago
thanks, resolved
F
Feraru Dynamics 2 months ago
Hi Faizal,

Any particular reason why Metronic is running on bleeding egde unstable dependencies?

What stops us from running on latest stable (5.2.3)
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Metronic

Go to MetronicDownloadsPurchase MetronicRefunds

React Dev Vacancy

KeenThemes is looking for a Junior React or Vue developer to build awesome apps.
Apply
keenthemes mega bundle