Error when recompiling themes from bootswatch using compass - compass-sass

Question

I'm trying to reproduce the css files of bootswatch using compass but I receive error.
My compass folders:
<project>
|_ css
| |_ styles.css
| |_ ..........
|_ fonts
| |_ bootstrap
|_ img
|_ js
|_ sass
|_ bootstrap
| |_ mixins
| |_ _variables.scss
| |_ .........
|_ themes
|_ _cerulean-bootswatch.scss
|_ _cerulean-variables.scss
|_ _bootstrap.scss
|_ _custom-variables.scss
|_ styles.scss
Compass uses last file styles.scss to produce styles.css.
I created a folder themes and copied there the cerulean files: _cerulean-bootswatch.scss and _cerulean-variables.scss. I used the project files where all bootswatch themes reside.
Now, I follow the directions of the projects page:
SASS:
#import "bootswatch/theme/variables";
#import "bootstrap-sass-official/assets/stylesheets/bootstrap";
#import "bootswatch/theme/bootswatch";
with my structure these would be:
import the theme variables (_cerulean-variables.scss)
import the bootstrap partial (_bootstrap.scss)
last import the relevant bootswatch partial (_cerulean-bootswatch.scss)
All the above happen at styles.scss:
// Import custom Bootstrap variables
// Bootswatch theme variables
//#import "themes/cerulean-variables"
// Import Bootstrap for Sass
#import "bootstrap";
// Bootswatch themes
#import "themes/cerulean-bootswatch"
If I un-comment /#import "themes/cerulean-variables" I receive error:
error sass/styles.scss (Line 29: Invalid CSS after "...tstrap for Sass": expected selector or at-rule, was "#import "bootst...")
and the styles.css contains the error:
"Error: Invalid CSS after \"...tstrap for Sass\": expected selector or at-rule, was \"#import \"bootst...\"\A on line 15 of bs-compass-simple/sass/styles.scss\A \A 10: // Bootswatch theme variables\A 11: #import \"themes/cerulean-variables\"\A 12: \A 13: \A 14: // Import Bootstrap for Sass\A 15: #import \"bootstrap\";\A 16: \A 17: // Bootswatch themes\A 18: #import \"themes/cerulean-bootswatch\"
Am I missing something?

Answer 1

You have missed out two semi-colons. Should be:
// Import custom Bootstrap variables
// Bootswatch theme variables
//#import "themes/cerulean-variables";
// Import Bootstrap for Sass
#import "bootstrap";
// Bootswatch themes
#import "themes/cerulean-bootswatch";
Either that or you might need:
// Import custom Bootstrap variables
// Bootswatch theme variables
//#import "themes/cerulean-variables"
// Import Bootstrap for Sass
#import "bootstrap"
// Bootswatch themes
#import "themes/cerulean-bootswatch"
If Compass uses a different syntax than I'm used to with vanilla SCSS or you've set something to a non-standard configuration. Either way usage should be consistent. I'd suggest likely the former, since the lack of semi-colon would cause an error at #import "bootstrap" when the browser attempted to parse both of the lines together, instead of separately.