Build Error with New Version

[briankgarland]

After the new version released on 3/15/22, I now get the following error. I had to go back to version 1.1.3.

file: D:/a/1/s/node_modules/hamburgers/_sass/hamburgers/_base.scss
line: 60
column: 19
formatted: Error: Invalid CSS after "...argin-top: math": expected expression (e.g. 1px, bold), was ".div($hamburger-lay"
on line 60 of node_modules/hamburgers/_sass/hamburgers/_base.scss
from line 68 of node_modules/hamburgers/_sass/hamburgers/hamburgers.scss

[JamesRobertWiseman]

@briankgarland I think you might be using 'Live Sass Compiler' extension for VSCode, if so the sass version has more than likely not been updated and is not compatible with this package.

You can use sass globally by running npm install sass -g, and then watch your files by running sass --watch <input-file-path> <output-file-path>. Otherwise there is the extension 'DartJS Sass Compiler' for VSCode which should work, thou I have not tested.

[briankgarland]

No, this was occurring in our Azure build pipeline. I'll have our DevOps guy look at it from his end. Thanks for the reply.

[nnerijuss]

Have the same error.

Module build failed: ModuleBuildError: Module build failed:
  margin-top: math.div($hamburger-layer-height, -2);
                 ^
      Invalid CSS after "...argin-top: math": expected expression (e.g. 1px, bold), was ".div($hamburger-lay"

Have been tried all node LTS versions from 10 to 17, error always the same.

[JamesRobertWiseman]

@nnerijuss Make sure your using the latest version of Dart SASS with your bundler.

[mtx-z]

Note that I had the same issue on my Sage 9.0.9 install which has in it's package.json:

"node-sass": "^4.14.1"

And I added at the time of dev

"hamburgers": "^1.1.3"

Since hamburgers 1.2.1 release, updating dependencies required 1.2.1 and broke the build.

I updated my package.json to require a strict 1.1.3 version "hamburgers": "1.1.3" (removing the ^ ) to correct the issue.

I could also update to Sage 9.0.10 which use "sass": "^1.41.0" instead of node-sass (sass >= 1.33.0 is required for math.div support source 1, 2).

[tatewaky]

@mtx-z thanks for that, totally make sense i even updated it to version 2 and did not worked, your suggestion not only make sense but also finally fix my problem.

[r7l]

I was running into the same issue using Gulp. I've also tried switching to the latest version of sass instead of node-sass. The error remains. Fixing hamburgers to 1.1.3 seems to be the only option here.

[magicDvlp]

Same problem. What are the possible solutions?

[magicDvlp]

Problem solved. I just needed to update sass