Error building bootstrap\scss\mixins\_utilities.scs on Vite

[wergh]

Prerequisites

• I have searched for duplicate or closed issues
• I have validated any HTML to avoid common problems
• I have read the contributing guidelines

Describe the issue

Note: content reformatted by maintainer

I have this package.json

{
    "private": true,
    "type": "module",
    "scripts": {
        "dev": "vite",
        "build": "vite build"
    },
    "devDependencies": {
        "@popperjs/core": "^2.11.8",
        "@vitejs/plugin-vue": "^5.0.4",
        "axios": "^1.6.4",
        "bootstrap": "^5.2.3",
        "laravel-vite-plugin": "^1.0",
        "sass": "^1.75.0",
        "vite": "^5.0"
    },
    "dependencies": {
        "@coreui/coreui": "^5.0.0",
        "vue-anka-cropper": "^1.1.0"
    }
}

When i Build with "npm run build" that is a Vite build, the building show me this error:

npm run build

> build
> vite build

vite v5.2.10 building for production...
transforming (1) resources\js\app.jsWarning: `alert-variant()` has been deprecated as of v4.3.0. It will be removed entirely in v6.0.0.
    node_modules\@coreui\coreui\scss\mixins\_deprecate.scss 8:5  deprecate()
    node_modules\@coreui\coreui\scss\mixins\_alert.scss 1:1      @import
    node_modules\@coreui\coreui\scss\_mixins.scss 28:9           @import
    node_modules\@coreui\coreui\scss\coreui.scss 10:9            @import
    resources\sass\app.scss 2:9                                  root stylesheet

✓ 1 modules transformed.
x Build failed in 8.58s
error during build:
Error: ("ltr": translate(-50%, -50%), "rtl": translate(50%, -50%)) isn't a valid CSS value.
   ╷
74 │             #{$property}: $value if($enable-important-utilities, !important, null);
   │                           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
   ╵
  node_modules\bootstrap\scss\mixins\_utilities.scss 74:27  root stylesheet
    at Object.wrapException (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:2184:43)
    at _SerializeVisitor0.visitMap$1 (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:108953:17)
    at SassMap0.accept$1$1 (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:103044:22)
    at SassMap0.accept$1 (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:103047:19)
    at _SerializeVisitor_visitList_closure4.call$1 (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:109673:15)
    at _SerializeVisitor0._serialize0$_writeBetween$1$3 (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:109510:18)
    at _SerializeVisitor0._serialize0$_writeBetween$3 (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:109514:19)
    at _SerializeVisitor0.visitList$1 (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:108896:13)
    at SassList0.accept$1$1 (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:102514:22)
    at SassList0.accept$1 (C:\Trabajo\laravel11\node_modules\sass\sass.dart.js:102517:19)`

My node version is:
node -v
v20.11.1

npm -v
10.5.2

Reduced test cases

Can make it because is an error when i build.

What operating system(s) are you seeing the problem on?

Windows

What browser(s) are you seeing the problem on?

Chrome

What version of Bootstrap are you using?

5.2.3

[github-actions]

Hello @wergh. Bug reports must include a live demo of the issue. Per our contributing guidelines, please create a reduced test case on CodePen or StackBlitz and report back with your link, Bootstrap version, and specific browser and Operating System details.

[github-actions]

As the issue was labeled with awaiting-reply, but there has been no response in 14 days, this issue will be closed. If you have any questions, you can comment/reply.