在 angular ag-grid 中获取“模块构建失败（来自./node_modules/sass-loader/dist/cjs.js）：SassError：无效的 CSS”

Question

I'm getting following error after even with node-sass, sass or without both of them. But i remove node modules and node cache clean, I'm still getting this error. I tried adding node-sass and sass versions also. but still this error keep coming. this was happened after I upgrade my ag-grid version to 27.3 from 23.4.

ERROR in ./src/styles.scss (./node_modules/css-loader/dist/cjs.js??ref--13-1!./node_modules/postcss-loader/src??embedded!./node_modules/sass-loader/dist/cjs.js??ref--13-3!./src/styles.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Invalid CSS after "    @return math": expected expression (e.g. 1px, bold), was ".div($lhs, $rhs);"
        on line 315 of node_modules/ag-grid-community/src/styles/mixins/_ag-theme-params.scss
        from line 1 of node_modules/ag-grid-community/src/styles/ag-theme-base/sass/_ag-theme-base-default-params.scss
        from line 1 of node_modules/ag-grid-community/src/styles/ag-theme-base/sass/_ag-theme-base-mixin.scss
        from line 1 of node_modules/ag-grid-community/src/styles/ag-theme-base/sass/_ag-theme-base.scss
        from line 1 of node_modules/ag-grid-community/src/styles/ag-theme-alpine/sass/_ag-theme-alpine-mixin.scss
        from line 2 of D:\Projects\Operative\Repo\ag-grid-update\finance\finance-frontend\src\styles.scss
>>     @return math.div($lhs, $rhs);

   ----------------^

need a help because I tried so many posted answers in SO.

Answer 1

As of Version 26 of AG Grid, Node-Sass will no longer work with AG Grid.

This is due to Node-Sass being deprecated in favor of Dart-Sass, you can find out more about this here .

For users upgrading from versions of AG Grid before 26 or new users, we would highly recommend using Sass .

For more information regarding AG Grid and Sass and how themes and styles work, please visit our documentation .