uni-app HBuilderX 4.5+ vue2 项目 scss编译报错

uni-app HBuilderX 4.5+ vue2 项目 scss编译报错

产品分类：uniapp/App

PC开发环境操作系统：Windows

PC开发环境操作系统版本号：win11

HBuilderX类型：正式

HBuilderX版本号：4.55

手机系统：全部

页面类型：vue

vue版本：vue2

打包方式：云端

项目创建方式：HBuilderX

示例代码：

/* 分列式弹性盒子，以X轴从左到右排列 */
.h-flex-x{
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-content: center;

    /* 水平左对齐 */
    &.h-flex-left{
        justify-content: flex-start;
    }

    /* 水平居中对齐 */
    &.h-flex-center{
        justify-content: center;
    }

    /* 水平右对齐 */
    &.h-flex-right{
        justify-content: flex-end;
    }

    /* 水平两端对齐 */
    &.h-flex-space{
        justify-content: space-between;
    }

    /* 垂直顶部对齐 */
    &.h-flex-top{
        align-items: flex-start;
        align-content: flex-start;
    }

    /* 垂直底部对齐 */
    &.h-flex-bottom{
        align-items: flex-end;
        align-content: flex-end;
    }

    /* 允许换行 */
    &.h-flex-wrap{
        flex-wrap: wrap;
    }

    /* 等比分列，2-6列 */
    @for $i from 2 through 6
    {
        &.h-flex-#{$i}{
            >view{
                width:(100% / $i);
            }
        }
    }

    /* 弹性元素 */
    >.h-flex-item-grow{
        flex-grow: 1;
        width:0;
    }
}

/* 分行式弹性盒子，以Y轴从上到下排列 */
.h-flex-y{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: flex-start;
    align-content: flex-start;

    /* 垂直居中对齐 */
    &.h-flex-center{
        justify-content: center;
        align-items: center;
        align-content: center;
    }

    /* 水平左对齐 */
    &.h-flex-left{
        align-items: flex-start;
        align-content: flex-start;
    }

    /* 水平右对齐 */
    &.h-flex-right{
        align-items: flex-end;
        align-content: flex-end;
    }

    /* 垂直两端对齐 */
    &.h-flex-space{
        justify-content: space-between;
    }

    /* 垂直顶部对齐 */
    &.h-flex-top{
        justify-content: flex-start;
    }

    /* 垂直底部对齐 */
    &.h-flex-bottom{
        justify-content: flex-end;
    }

    /* 等比分行，2-6行 */
    @for $i from 2 through 6
    {
        &.h-flex-#{$i}{
            >view{
                height:(100% / $i);
            }
        }
    }

    /* 弹性元素 */
    >.h-flex-item-grow{
        flex-grow: 1;
        height: 0;
    }
}

helang-flex.scss

操作步骤：

发行H5 打包 小程序调试均报错

预期结果：

4.45之前版本都正常 4.55无法正常打包

实际结果：

4.45之前版本都正常 4.55无法正常打包

bug描述：

报错提示
4.45版本正常 升级到4.55就报错无法打包调试
[HBuilder] 17:17:30.699 DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.
[HBuilder] 17:17:30.700 Recommendation: math.div(100%, 3)
[HBuilder] 17:17:30.700 More info and automated migrator: https://sass-lang.com/d/slash-div
[HBuilder] 17:17:30.700     ╷
[HBuilder] 17:17:30.700 798 │                         width: (100%/3);
[HBuilder] 17:17:30.700     │                                 ^^^^^^
[HBuilder] 17:17:30.700     ╵
[HBuilder] 17:17:30.700     stdin 798:15  root stylesheet
[HBuilder] 17:17:30.762 DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.
[HBuilder] 17:17:30.762 Recommendation: math.div(100%, 3)
[HBuilder] 17:17:30.762 More info and automated migrator: https://sass-lang.com/d/slash-div
[HBuilder] 17:17:30.762      ╷
[HBuilder] 17:17:30.762 1089 │                     width: (100%/3);
[HBuilder] 17:17:30.762      │                             ^^^^^^
[HBuilder] 17:17:30.763      ╵
[HBuilder] 17:17:30.763     stdin 1089:14  root stylesheet
[HBuilder] 17:17:30.763 DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.
[HBuilder] 17:17:30.763 Recommendation: math.div(100%, 3)
[HBuilder] 17:17:30.763 More info and automated migrator: https://sass-lang.com/d/slash-div
[HBuilder] 17:17:30.763     ╷
[HBuilder] 17:17:30.763 896 │                     width: (100%/3);
[HBuilder] 17:17:30.763     │                             ^^^^^^
[HBuilder] 17:17:30.763     ╵
[HBuilder] 17:17:30.763     stdin 896:14  root stylesheet
[HBuilder] 17:17:31.398 DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.
[HBuilder] 17:17:31.398 Recommendation: math.div(100%, $i)
[HBuilder] 17:17:31.398 More info and automated migrator: https://sass-lang.com/d/slash-div
[HBuilder] 17:17:31.398    ╷
[HBuilder] 17:17:31.398 57 │                 width:(100% / $i);
[HBuilder] 17:17:31.398    │                        ^^^^^^^^^
[HBuilder] 17:17:31.398    ╵
[HBuilder] 17:17:31.398    ********\components\helang-tabBar\helang-flex.scss 57:12  [@import](/user/import)
[HBuilder] 17:17:31.398     stdin 149:9                                                                          root stylesheet
[HBuilder] 17:17:31.416 DEPRECATION WARNING: Using / for division is deprecated and will be removed in Dart Sass 2.0.0.
[HBuilder] 17:17:31.417 Recommendation: math.div(100%, $i)
[HBuilder] 17:17:31.417 More info and automated migrator: https://sass-lang.com/d/slash-div
[HBuilder] 17:17:31.417     ╷
[HBuilder] 17:17:31.417 117 │                 height:(100% / $i);
[HBuilder] 17:17:31.417     │                         ^^^^^^^^^
[HBuilder] 17:17:31.417     ╵
[HBuilder] 17:17:31.417     *************\components\helang-tabBar\helang-flex.scss 117:13  [@import](/user/import)
[HBuilder] 17:17:31.417     stdin 149:9                                                                           root stylesheet
[HBuilder] 17:17:37.943 Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js):
[HBuilder] 17:17:37.943 SassError: expected selector.
[HBuilder] 17:17:37.943     ╷
[HBuilder] 17:17:37.943 202 │                 /deep/ .uni-icons{
[HBuilder] 17:17:37.943     │                 ^
[HBuilder] 17:17:37.943     ╵
[HBuilder] 17:17:37.943   *********************\components\helang-tabBar\tab-bar-bubble.vue 202:5  root stylesheet