Not able to compile sass files on Laravel 8 bootstrap

Question

When I am trying to compile bootstrap scaffolding on laravel version 8, below errors are coming

node_modules\bootstrap\scss\mixins\_grid.scss 67:16            row-cols()
    node_modules\bootstrap\scss\mixins\_grid-framework.scss 43:13  @content
    node_modules\bootstrap\scss\mixins\_breakpoints.scss 65:5      media-breakpoint-up()
    node_modules\bootstrap\scss\mixins\_grid-framework.scss 32:5   make-grid-columns()
    node_modules\bootstrap\scss\_grid.scss 72:3                    @import
    node_modules\bootstrap\scss\bootstrap.scss 16:9                @import
    resources\sass\app.scss 8:9                                    root stylesheet

DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.

Recommendation: math.div(100%, $count)

More info and automated migrator: https://sass-lang.com/d/slash-div

   ╷
66 │     flex: 0 0 100% / $count;
   │               ^^^^^^^^^^^^^
   ╵
    node_modules\bootstrap\scss\mixins\_grid.scss 66:15            row-cols()
    node_modules\bootstrap\scss\mixins\_grid-framework.scss 43:13  @content
    node_modules\bootstrap\scss\mixins\_breakpoints.scss 65:5      media-breakpoint-up()
    node_modules\bootstrap\scss\mixins\_grid-framework.scss 32:5   make-grid-columns()
    node_modules\bootstrap\scss\_grid.scss 72:3                    @import
    node_modules\bootstrap\scss\bootstrap.scss 16:9                @import
    resources\sass\app.scss 8:9                                    root stylesheet

DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.

Could anyone help to resolve this please? Thank you

Answer 1

Don't use version 1.33.0, use the version before that 1.32.13 for now. Change it on your package.json "sass": "1.32.13" And wait for the fix on the next version.

Answer 2

You either have a syntax error in /resources/sass/app.scss. Open the file and search for flex: 0 0 100% / $count; Replace with flex: 0 0 math.div(100%, $count) If it's not there then your version of bootstrap have broken changes try updating

Version related see accepted answer

Reference https://sass-lang.com/d/slash-div