解决SassError: Invalid CSS after “}“: expected selector, was “,“

最新推荐文章于 2024-12-02 17:46:47 发布

原创最新推荐文章于 2024-12-02 17:46:47 发布 · 7.9k 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#css #vue.js #javascript

css 同时被 3 个专栏收录

19 篇文章

订阅专栏

uni-app

6 篇文章

订阅专栏

HBuilder

1 篇文章

订阅专栏

在更新了HBuilder后，开发者遇到项目报错，主要涉及Sass编译问题，错误信息指出在CSS中发现无效的语法`}

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

啊哎！更新了HBuilder之后，项目报错了，以前的页面，且看错误

1 请注意运行模式下，因日志输出、sourcemap以及未压缩源码等原因，性能和包体积，均不及发行模式。若要正式发布，请点击发行菜单或使用cli发布命令进行发布
08:40:17.896 小程序各家浏览器内核及自定义组件实现机制存在差异，可能存在样式布局兼容问题，参考：https://uniapp.dcloud.io/matter?id=mp
08:40:17.897 正在编译中...
08:40:48.774 Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
08:40:48.774 ModuleBuildError: Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js):
08:40:48.780 SassError: Invalid CSS after "}": expected selector, was ","
08:40:48.780         on line 144 of D:\WebstormWorkspace\yue-uniapp\pages\aftersale\courier.vue
08:40:48.786 >> },
08:40:48.786    -^
08:40:48.794     at D:\hbuider\plugins\uniapp-cli\node_modules\webpack\lib\NormalModule.js:316:20
08:40:48.794     at D:\hbuider\plugins\uniapp-cli\node_modules\loader-runner\lib\LoaderRunner.js:367:11
08:40:48.801     at D:\hbuider\plugins\uniapp-cli\node_modules\loader-runner\lib\LoaderRunner.js:233:18
08:40:48.802     at D:\hbuider\plugins\uniapp-cli\node_modules\loader-runner\lib\LoaderRunner.js:111:13
08:40:48.810     at Object.callback (D:\hbuider\plugins\uniapp-cli\node_modules\@dcloudio\vue-cli-plugin-uni\packages\sass-loader\dist\index.js:75:7)
08:40:48.811     at Object.done [as callback] (D:\hbuider\plugins\uniapp-cli\node_modules\neo-async\async.js:8067:18)
08:40:48.818     at D:\hbuider\plugins\compile-node-sass\node_modules\node-sass-china\lib\index.js:294:32
08:40:48.819 Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
08:40:48.827 ModuleBuildError: Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js):
08:40:48.827 SassError: Invalid CSS after "}": expected selector, was ","
08:40:48.834         on line 371 of D:\WebstormWorkspace\yue-uniapp\pages\aftersale\detail.vue
08:40:48.835 >> },
08:40:48.843    -^
08:40:48.844     at D:\hbuider\plugins\uniapp-cli\node_modules\webpack\lib\NormalModule.js:316:20
08:40:48.852     at D:\hbuider\plugins\uniapp-cli\node_modules\loader-runner\lib\LoaderRunner.js:367:11
08:40:48.852     at D:\hbuider\plugins\uniapp-cli\node_modules\loader-runner\lib\LoaderRunner.js:233:18
08:40:48.862     at D:\hbuider\plugins\uniapp-cli\node_modules\loader-runner\lib\LoaderRunner.js:111:13
08:40:48.862     at Object.callback (D:\hbuider\plugins\uniapp-cli\node_modules\@dcloudio\vue-cli-plugin-uni\packages\sass-loader\dist\index.js:75:7)
08:40:48.870     at Object.done [as callback] (D:\hbuider\plugins\uniapp-cli\node_modules\neo-async\async.js:8067:18)
08:40:48.871     at D:\hbuider\plugins\compile-node-sass\node_modules\node-sass-china\lib\index.js:294:32
08:40:48.879 Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
08:40:48.880 ModuleBuildError: Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/sass-loader/dist/cjs.js):
08:40:48.889 SassError: Invalid CSS after "}": expected selector, was ","
08:40:48.889         on line 409 of D:\WebstormWorkspace\yue-uniapp\pages\aftersale\index.vue
08:40:48.896 >> },
08:40:48.896    -^
08:40:48.904     at D:\hbuider\plugins\uniapp-cli\node_modules\webpack\lib\NormalModule.js:316:20
08:40:48.905     at D:\hbuider\plugins\uniapp-cli\node_modules\loader-runner\lib\LoaderRunner.js:367:11
08:40:48.913     at D:\hbuider\plugins\uniapp-cli\node_modules\loader-runner\lib\LoaderRunner.js:233:18
08:40:48.914     at D:\hbuider\plugins\uniapp-cli\node_modules\loader-runner\lib\LoaderRunner.js:111:13
08:40:48.921     at Object.callback (D:\hbuider\plugins\uniapp-cli\node_modules\@dcloudio\vue-cli-plugin-uni\packages\sass-loader\dist\index.js:75:7)
08:40:48.921     at Object.done [as callback] (D:\hbuider\plugins\uniapp-cli\node_modules\neo-async\async.js:8067:18)
08:40:48.929     at D:\hbuider\plugins\compile-node-sass\node_modules\node-sass-china\lib\index.js:294:32

HBuider版本信息

找到报错原因

找到页面把这个css}后的","拿掉

可是我发现它报错的line 号并不准确

如：

       on line 409 of D:\WebstormWorkspace\yue-uniapp\pages\aftersale\index.vue
08:52:42.961 >> },

项目页面实际最大行号才403

报错信息中说css有

}，

实际代码中确实存在以下

拿掉后

是HBuilder更新后对sass语法检测更加严格了