Import errors with bootstrap-sass-official/other sass files. about ember-cli-compass-compiler

[quaertym]

I use bootstrap-sass and this addon in many projects. This is the line to add to your appname.scss (remove underscore from name):

@import "../../bower_components/bootstrap-sass-official/assets/stylesheets/bootstrap";

[andrewobrien]

I have the exact same issue as @sumeetattree, not picking up bootstrap mixins or variables... using bootstrap-sass-official#3.3.1

[quaertym]

@andrewobrien Have you seen my previous comment?

[lolmaus]

Try this in Brocfile.js:

var app = new EmberApp({
  compassOptions: {
    outputStyle: 'expanded',
    importPath: [
      'bower_components/bootstrap-sass-official/assets/stylesheets',
      'bower_components/breakpoint-sass/stylesheets',
      'bower_components/singularity/stylesheets'
    ]
    //require: []
  }
});

Reference: http://hbrysiewicz.github.io/2014-10-14-ember-bootstrap-sass-summernote.html

[lolmaus]

Alternatively, you can create a config.rb and add the following:

add_import_path 'bower_components/bootstrap-sass-official/assets/stylesheets'
add_import_path 'bower_components/breakpoint-sass/stylesheets'
add_import_path 'bower_components/singularity/stylesheets'

[quaertym]

@sumeetattree Please close this issue, if it fixed by one of the answers.

[bj-mcduck]

Maybe this could be added to the docs?

[quaertym]

@brandonjmckay I'd love a PR if you have time.

[Baril27]

I have run into a very similar issue in my project. @sumeetattree did you ever find a fix for your issues when importing the mixin 'font-smoothing'. Seems to be very similar to my issue when trying to use variables within my other .scss files in app/styles.

Here is my app.scss:

@import "compass";

@import "variables";
@import "mixins";
@import "global";

And here is the error I got in console:
NOTE: '$color-darkGrey-3' is declared in app/styles/variables.scss and called in app/styles/global.scss

directory tmp/compass_compiler-output_path-rtFm3mTj.tmp/assets
    write tmp/compass_compiler-output_path-rtFm3mTj.tmp/assets/app.css
    error app/styles/global.scss (Line 6: Undefined variable: "$color-darkGrey-3".)
    write tmp/compass_compiler-output_path-rtFm3mTj.tmp/assets/mixins.css
    write tmp/compass_compiler-output_path-rtFm3mTj.tmp/assets/variables.css
Compilation failed in 1 files.


Command failed: /bin/sh -c compass compile --output-style=compressed --sass-dir=app/styles --css-dir="/Users/ericbaril/Git/Spinlister/spinlister-www-ember/tmp/compass_compiler-output_path-rtFm3mTj.tmp/assets"

Error: Command failed: /bin/sh -c compass compile --output-style=compressed --sass-dir=app/styles --css-dir="/Users/ericbaril/Git/Spinlister/spinlister-www-ember/tmp/compass_compiler-output_path-rtFm3mTj.tmp/assets"

[bj-mcduck]

Ya, I shouldn't be suggesting that if I can't do it. @quaertym Sorry for that.

[prudvi]

#37 (comment)

facing above same issue and
here i am adding my issue

error app/styles/dom/date_pickers.scss (Line 21: Undefined variable: "$midgrey".)
Compilation failed in 48 files.

Command failed: /bin/sh -c compass compile --output-style=compressed --sass-dir=app/styles --css-dir="/home/indiapc_dev_05/OfficeAPP/emberCLI/my-new-app/tmp/compass_compiler-output_path-3WaMIRMY.tmp/assets"

rror: Command failed: /bin/sh -c compass compile --output-style=compressed --sass-dir=app/styles --css-dir="/home/indiapc_dev_05/OfficeAPP/emberCLI/my-new-app/tmp/compass_compiler-output_path-3WaMIRMY.tmp/assets"