The error: “Laravel Mix | Bootstrap DEPRECATION WARNING: Using / for division is deprecated and will be removed” is a common error that can show up in many ways. In this blog, we will go through some of the ways you can fix this issue. Read on.

How To Solve The Error: “Laravel Mix | Bootstrap DEPRECATION WARNING: Using / for division is deprecated and will be removed”?

Using npm, I installed bootstrap in the Laravel application today. When I attempt to compile Laravel, it only displays endless warnings. Next, I notice the endless Loop warning.

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

Recommendation: math.div($spacer, 4)

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

    ╷

253 │   1: $spacer / 4,

    │      ^^^^^^^^^^^

    ╵

    node_modules\bootstrap\scss\_variables.scss 253:6  @import

    node_modules\bootstrap\scss\bootstrap.scss 11:9    @import

    resources\css\app.scss 2:9                         root stylesheet

The “Laravel Mix | Bootstrap DEPRECATION WARNING: Using / for division is deprecated and will be removed” error happens due to a lot of reasons, so let’s see how to fix it.

Approach 1: Dowgrade to a specified version 

Simply downgrade to a specified version of the software, which is SASS in this example. This will upgrade all of your other NPM packages as well. If you don’t want to do that, delete “sass” from the package-lock.json and the node modules folder. use the command shown below.

1. Modify “sass”: “^1.33.0”, to “sass”: “1.32.13”, in your package.json.
2. Remove package-lock.json.
3. Remove the node_modules folder.
4. Use npm install.

Approach 2: Follow these instructions

Simply follow these instructions to solve your problem “Laravel Mix | Bootstrap DEPRECATION WARNING: Using / for division is deprecated and will be removed”.

1. Delete node_modules rm -r .\node_modules\
2. Delete package-lock.json rm -r .\package-lock.json
3. Include one line “sass”: “1.32.13” in package.json under devDependencies part.

Approach 3: Simply include devDependencies

If you utilize npm, you can simply add devDependencies to fix the error “Laravel Mix | Bootstrap DEPRECATION WARNING: Using / for division is deprecated and will be removed”.

"devDependencies": {

    ...,

    "sass": "~1.32.12"

}

Approach 4: Utilize the tilde ~

For the past two and a half years, the tilde ~ has served as the primary semver range specifier in package.json dependent definitions. Package authors can now pin to releases within a stable major and minor pair but a floating patch version due to npm install –-save.

It should operate if you modify your sass version to utilize the tilde ~. This is since only fixes will be allowed, rather than upgraded minor versions.

Package.json line instance:

"sass": "~1.32.6"

Approach 5: Utilize 1.32.13 instead of 1.33.0

For now, utilize 1.32.13 instead of 1.33.0. It should be changed on your package. json “sass”: “1.32.13”. Next, wait for the next release to solve it.

Approach 6: Utilize the Sass migrator

Sass is a superset of CSS, so you can match CSS’ syntax by redefining / to just be a separator. Similar to how, functions today, / will be regarded as a new kind of list separator. Instead, the new math.div() function will be used to write division. This function will operate in the exact same way as / does right now. You can utilize the Sass migrator to automatically change your stylesheets to utilize math.div, as stated in the SASS document.

$ npm install -g sass-migrator

$ sass-migrator division **/*.scss

This is also a great solution to solve the “Laravel Mix | Bootstrap DEPRECATION WARNING: Using / for division is deprecated and will be removed” error.

Conclusion

We hope you enjoyed our article about the error. With this knowledge, we know that you can fix your error: “Laravel Mix | Bootstrap DEPRECATION WARNING: Using / for division is deprecated and will be removed” quickly by following these steps! If you still have any other questions about fixing this syntax error, please leave a comment below. Thank you for reading!

Read more

→ Solutions For “Laravel 8 Fresh Installation With Livewire Npm Install && Npm Run Dev Error”