app-generator / django-volt-dashboard

Django Bootstrap 5 - Volt Dashboard | AppSeed
https://appseed.us/product/volt-dashboard/django/
Other
289 stars 152 forks source link

Gulp error #12

Open Punisheroot opened 2 years ago

Punisheroot commented 2 years ago

Hi, i have a problem with gulp: Message: Error in plugin "sass" Message: node_modules\vanillajs-datepicker\sass\datepicker.scss Error: Invalid CSS after "...ize-base * math": expected expression (e.g. 1px, bold), was ".div(7, 8);" on line 53 of node_modules/vanillajs-datepicker/sass/datepicker.scss from line 24 of scss/volt.scss

-shrinked-width: $dp-cell-size-base * math.div(7, 8);

Node version: 6.15.0 Gulp version: 4.0.2

app-generator commented 2 years ago

Hello @Punisheroot

This problem is caused by math.div call that should be replaced as bellow:

Original Sample

body {
  font-size: math.div(32px, 2);
}

Patch/workaround Sample

body {
  font-size: (32px/2);
}

Being a problem inside a dependency package, we can't assist you further with this issue.

P.S. The problem will be forwarded to Themesberg, the agency that provides the design. In case they patch the product, we will update accordingly.

Punisheroot commented 2 years ago

Hi i fixed all the math.div in node_modules\vanillajs-datepicker\sass\datepicker.scss, but i have another error:

Error in plugin "sass" Message: node_modules\bootstrap\scss_utilities.scss Error: Undefined variable: "$utilities-border-colors". on line 142 of node_modules/bootstrap/scss/_utilities.scss from line 29 of scss/volt.scss

  values: $utilities-border-colors

EDIT: I fixed the error adding

@import "_maps";

in node_modules\bootstrap\scss_utilities.scss

app-generator commented 2 years ago

Noted, ty!

nitsujri commented 1 year ago

For those coming here and can't get gulp to work, to fix this properly:

  1. node-sass needs to be replaced with saas to get the math.div function in the package.json
    • update the gulp.js.
    • add @use 'saas:math'; at the top of the file for any that uses math.div.
  2. @import "../node_modules/bootstrap/scss/maps"; should be added above @import "../node_modules/bootstrap/scss/utilities"; Don't edit the files in node_modules directly. They'll disappear on update.