How to suppress Bootstrap 5.3.1 deprecation warning for global abs() function when compiling scss with Vite?

I am trying to suppress a Deprecation Warning for global abs() function when compiling Bootstrap 5.3.1 scss using Vite with npm.

I am using node v16.20.2 and npm 8.19.4 because this is the highest node version which my macOS system will let me install. However, even though I am using an outdated version of node @16, I am still able to use the latest npm sass, vite and bootstrap packages.

See my full package.json config below...

{
  "private": true,
  "scripts": {
    "dev": "vite",
    "watch": "npm run dev",
    "build": "vite build",
    "production": "vite build"
  },
  "devDependencies": {
    "laravel-vite-plugin": "^0.8.0",
    "sass": "1.66.1",
    "vite": "^4.4.9"
  },
  "dependencies": {
    "bootstrap": "^5.3.1"
  }
}

Here is my vite.config.js if anyone wants to test after installing this npm package above...

import {defineConfig} from "vite";
import laravel from 'laravel-vite-plugin';

export default defineConfig(() => ({
    base: '',
    build: {
        emptyOutDir: true,
        manifest: true,
        outDir: 'build',
        assetsDir: 'assets'
    },
    plugins: [
        laravel({
            publicDirectory: 'build',
            input: [
                'resources/scss/theme.scss'
            ],
            refresh: [
                '**.php'
            ]
        })
    ],
    resolve: {
        alias: [
            {
                find: /~(.+)/,
                replacement: process.cwd() + '/node_modules/$1'
            },
        ]
    }
}));

Here is my theme.scss code below, which is taken from Option A in Bootstrap 5.3 Customize SASS docs...

// Option A: Include all of Bootstrap
@import "../node_modules/bootstrap/scss/bootstrap";

I also get the same Deprecated Warning below when using Option B in Bootstrap 5.3 Customize SASS docs.

Ok so when I compile my theme.scss using the npm and Vite configuration above, this is the Deprecation Warning outputted in the full Vite log...

10:47:58 PM [vite] hmr update /resources/scss/theme.scss?direct (x8)
Deprecation Warning: Passing percentage units to the global abs() function is deprecated.
In the future, this will emit a CSS abs() function to be resolved by the browser.
To preserve current behavior: math.abs(100%)
To emit a CSS abs() now: abs(#{100%})
More info: https://sass-lang.com/d/abs-percent

   ╷
57 │   $dividend: abs($dividend);
   │              ^^^^^^^^^^^^^^
   ╵
    node_modules/bootstrap/scss/vendor/_rfs.scss 57:14         divide()
    node_modules/bootstrap/scss/mixins/_grid.scss 59:12        row-cols()
    node_modules/bootstrap/scss/mixins/_grid.scss 85:13        @content
    node_modules/bootstrap/scss/mixins/_breakpoints.scss 68:5  media-breakpoint-up()
    node_modules/bootstrap/scss/mixins/_grid.scss 72:5         make-grid-columns()
    node_modules/bootstrap/scss/_grid.scss 38:3                @import
    node_modules/bootstrap/scss/bootstrap.scss 20:9            @import
    resources/scss/theme.scss 2:9                              root stylesheet

I've tried suppressing the warning using sass variable shown below, placed at the top of my theme.scss, but this doesn't suppress Deprecation Warning...?

// Suppress Sass deprecation warning
$deprecation-warning-threshold: false;

// Option A: Include all of Bootstrap
@import "../node_modules/bootstrap/scss/bootstrap";

I've found this related issue posted on the official Bootstrap github repo...

• https://github.com/twbs/bootstrap/issues/39028

But from what I can make out in this issue page, people are suggesting manually changing code in the node_modules directory...

1. In node_modules/bootstrap/scss/vendor/_rfs.scss file, add to top: @use 'sass:math';
2. In line error, replace: $dividend: abs($dividend); to $dividend: math.abs($dividend);

I would rather not do this as I am not committing the node_modules directory to my project repo.

Is there any other possible way to suppress this Deprecation Warning from my Vite log when compiling theme.scss with npm run build and npm run dev hot replacement module?

Any ideas would be much appreciated, thanks!

Not the cleanest of solutions. But until this is fixed, if I downgrade my sass in my npm package to version ~1.64.2 the Deprecation Warning does not occur.

Using the tilde ~ symbol stops this version getting updated any further when running npm update for other packages.

{
  "private": true,
  "scripts": {
    "dev": "vite",
    "watch": "npm run dev",
    "build": "vite build",
    "production": "vite build"
  },
  "devDependencies": {
    "laravel-vite-plugin": "^0.8.0",
    "sass": "~1.64.2",
    "vite": "^4.4.9"
  },
  "dependencies": {
    "bootstrap": "^5.3.1"
  }
}