ElemeFE / ElemeFE/element

[Bug Report] Dart-Sass Deprecation Warning: Using / for division outside of calc()

Open
#21,676 23 comments 6 reactions 0 assignees View on GitHub
Dominant language
Vue
Stars
54k
Forks
14.4k
PR merge metrics
No merged PRs in 30d

Description

### Element UI version
2.15.6

### OS/Browsers version
Compile Time Error

### Vue version
2.6.14

### Dart Sass
"sass": "^1.49.7",

### Reproduction Link
https://codepen.io/ziyoung/pen/LKNBqB?editors=1111

### Steps to reproduce
I cannot produce with jsfiddle or codepen because I cannot make it compile with dart-sass. Run any code using elementui with dart-saas. Error is referencing elementui core library code. using Division outside of calc() is present in multiple files. Dart-Sass Error is

Deprecation Warning: Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.
Recommendation: math.div($--tooltip-arrow-size, 2) or calc($--tooltip-arrow-size / 2)
More info and automated migrator: https://sass-lang.com/d/slash-div
89 margin-bottom: #{$--tooltip-arrow-size / 2};

You can use [the Sass migrator](https://github.com/sass/migrator#readme) to automatically update your stylesheets to use math.div() and list.slash().

$ npm install -g sass-migrator
$ sass-migrator division **/*.scss

### What is Expected?
The code is currently working however I wanted to make you aware that it will no longer work with dart-sass as of version 2. (Dart-Sass 2). Any place you have division in your styles will need updated to use calc(). I ABSOLUTELY love ElementUI!!!! I would hate to have to discontinue using it down the road due to incompatibility issues.

### What is actually happening?
Deprecation Warning: Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0.
Recommendation: math.div($--tooltip-arrow-size, 2) or calc($--tooltip-arrow-size / 2)
More info and automated migrator: https://sass-lang.com/d/slash-div
89 margin-bottom: #{$--tooltip-arrow-size / 2};

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.