Grunt compass:dist task failing due to Invalid CSS in bootstrap-sass-official/assets/stylesheets/bootstrap/_variables.scss

[zishon89us]

grunt build is failing by yielding following error:

error app/styles/directive.scss (Line 369 of bower_components/bootstrap-sass-official/assets/stylesheets/bootstrap/_variables.scss: Invalid CSS after "... floor(math": expected ")", was ".div($grid-gutt...")

Gruntfile.js has compass and build task like below:

grunt.initConfig({

        ....

        compass: {
            options: {
                sassDir: '<%= yeoman.app %>/styles',
                cssDir: '.tmp/styles',
                generatedImagesDir: '.tmp/images/generated',
                imagesDir: '<%= yeoman.app %>/images',
                javascriptsDir: '<%= yeoman.app %>/scripts',
                fontsDir: '<%= yeoman.app %>/styles/fonts',
                importPath: './bower_components',
                httpImagesPath: '/images',
                httpGeneratedImagesPath: '/images/generated',
                httpFontsPath: '/styles/fonts',
                relativeAssets: false,
                assetCacheBuster: false,
                raw: 'Sass::Script::Number.precision = 10\n'
            },
            dist: {
                options: {
                    generatedImagesDir: '<%= yeoman.dist %>/images/generated'
                }
            },
            server: {
                options: {
                    sourcemap: true
                }
            }
        },

        concurrent: {
            server: [
                'compass:server'
            ],
            test: [
                'compass'
            ],
            dist: [
                'compass:dist',
                'imagemin',
                'svgmin'
            ]
        },
        ....
    });

grunt.registerTask('build', [
        'concurrent:dist',
    ]);

package.json includes:

"grunt-contrib-compass": "^1.0.0",

bower.json includes:

"bootstrap-sass-official": "^3.2.0",

Other information:

OS: Linux Ubuntu 18.10

Node: v8.17.0

NPM: v6.13.4

Ruby: ruby 2.5.1p57 (2018-03-29 revision 63029) [x86_64-linux-gnu]

Compass: Compass 1.0.3 (Polaris)

SO Link: https://stackoverflow.com/questions/71580046/grunt-compassdist-task-failing-due-to-invalid-css-in-bootstrap-sass-official-as

[Petya-Naumova-MM]

Do we have some fix for this one? I am facing the same error.

[themainframe]

This is probably because you're specifying ^3.2.0 - the ^ will mean you'll upgrade to minor versions automatically (anything matching 3.x.x, essentially). You've probably ended up with 3.4.2 or newer installed, which changed to using a new syntax for division in Sass that isn't supported by some compilers. Change your bower.json to:

"bootstrap-sass-official": "3.4.1",

You should also check any other "loose" semver specs since these are at risk of breaking when changes like this are pushed. I suppose there's a debate on whether this should have caused a major version bump but that's above my station to decide!

[Petya-Naumova-MM]

This is probably because you're specifying ^3.2.0 - the ^ will mean you'll upgrade to minor versions automatically (anything matching 3.x.x, essentially). You've probably ended up with 3.4.2 or newer installed, which changed to using a new syntax for division in Sass that isn't supported by some compilers. Change your bower.json to:

"bootstrap-sass-official": "3.4.1",

You should also check any other "loose" semver specs since these are at risk of breaking when changes like this are pushed. I suppose there's a debate on whether this should have caused a major version bump but that's above my station to decide!

Hello, thank you for the suggestion and sorry for the late response. I just tried your suggested fix. It actually did work. Thanks! themainframe

[prachikhadke]

I am seeing this error for 3.4.3 as well.