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

更新了 Taro 后，npm run dev:weapp 显示如下异常：

编译  发现入口  src/app.ts
编译  发现页面  src/pages/index/index.tsx

/ 正在编译...Deprecation Warning: Using / for division outside of calc() 
is deprecated and will be removed in Dart Sass 2.0.0.

Recommendation: math.div($at-button-height, 2) or calc($at-button-height 
/ 2)

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

   ╷
87 │     border-radius: $at-button-height / 2;
   │                    ^^^^^^^^^^^^^^^^^^^^^
   ╵
    node_modules\taro-ui\dist\style\components\button.scss 87:20  @import    src\styles\taro-custom.scss 8:9                               @import    src\app.scss 1:9                                              root stylesheet

...

解决方法

1.新增脚本, 例如 fix-scss.sh:

echo "---===installation dependency===---"
yarn add --dev sass-migrator patch-package postinstall-postinstall

echo "use sass-migrator to fix problems"
./node_modules/.bin/sass-migrator division ./node_modules/taro-ui/dist/style/components/*.scss

echo "---===use patch-package to save this edit===---"
./node_modules/.bin/patch-package taro-ui

echo "---===use postinstall-postinstall to automatic operation in the future===---"
hasPostinstall=$(grep '"postinstall":' package.json)
if [[ "$hasPostinstall" != "" ]];then
    echo "Make sure your package.json has following [script:{\"postinstall\": \"patch-package\", ...]"
else
    scriptLine=$(grep -n '"scripts": {' package.json  | cut -d : -f 1)
    newScript=$(sed "${scriptLine}a\    \"postinstall\": \"patch-package\"," package.json)
    echo "$newScript" > package.json
    echo "done!"
fi

2.执行脚本

sh fix-scss.sh

// 或 fix-scss.sh

脚本执行会在项目根目录生成 patches 文件夹，内容如下：

仍未解决可前往 github issues。