Sencha Touch 2.3 - Sass @mixin Breaks sencha app build

Question

Just upgraded to Sencha Touch 2.3 - everything is great until I added my Sass mixins, and tried "sencha app build"...

update / note: "sencha app watch" also causes the same error.

(Sencha CMD 4.0.1.45)

My mixin:

@mixin MQ($canvas) {
  @if $canvas == small {
    @media only screen and (max-width: 20em) { @content; } //320px
  }
  @else if $canvas == 'XS' {
    @media only screen and (max-width: 30em) { @content; } //480px
  }
  @else if $canvas == S {
    @media only screen and (max-width: 37.5em) { @content; } //600px
  }
  @else if $canvas == medium {
    @media only screen and (max-width: 48em) { @content; } //768px
  }
  @else if $canvas == larger {
    @media only screen and (min-width: 769px) { @content; } //1024px
  }
  @else if $canvas == XL {
    @media only screen and (min-width: 75em) { @content; } //1200px
  }
}

Example usage:

#Login{

  background: #2f7790;

  #spacer{

    @include MQ(small) {
      margin-top: 42%;
    }
  }
}

(doesn't matter if I delete this one, it will find the next one and throw the same error) Then when I try to run "sencha app build":

[INF] -compass-compile-sass-dir:
[INF] executing compass using system installed ruby runtime
Sass::SyntaxError on line ["14"] of /Users/jakeF/dev/SENCHA/MyApp/resources/sass/partials/_login.scss: Invalid CSS after "...lude MQ(small) ": expected "}", was "{"
/Users/jakeF/dev/SENCHA/MyApp/resources/sass/partials/X__default-theme.scss:6
/Users/jakeF/dev/SENCHA/MyApp/resources/sass/app.scss:8
/Users/jakeF/bin/Sencha/Cmd/4.0.1.45/extensions/sencha-compass/gems/gems/sass-3.1.7/lib/sass/scss/parser.rb:896:in `expected'
  /Users/jakeF/bin/Sencha/Cmd/4.0.1.45/extensions/sencha-compass/gems/gems/sass-3.1.7/lib/sass/scss/parser.rb:841:in `expected'
/Users/jakeF/bin/Sencha/Cmd/4.0.1.45/extensions/sencha-compass/gems/gems/sass-3.1.7/lib/sass/scss/parser.rb:836:in `tok!'
  /Users/jakeF/bin/Sencha/Cmd/4.0.1.45/extensions/sencha-compass/gems/gems/sass-3.1.7/lib/sass/scss/parser.rb:362:in `block'
/Users/jakeF/bin/Sencha/Cmd/4.0.1.45/extensions/sencha-compass/gems/gems/sass-3.1.7/lib/sass/scss/parser.rb:355:in `ruleset'
  /Users/jakeF/bin/Sencha/Cmd/4.0.1.45/extensions/sencha-compass/gems/gems/sass-3.1.7/lib/sass/scss/parser.rb:417:in `block in declaration_or_ruleset'

...


 /Users/jakeF/bin/Sencha/Cmd/4.0.1.45/extensions/sencha-compass/gems/bin/compass:23:in `load'
  /Users/jakeF/bin/Sencha/Cmd/4.0.1.45/extensions/sencha-compass/gems/bin/compass:23:in `<main>'
error app.scss (Line 14 of partials/_login.scss: Invalid CSS after "...lude MQ(small) ": expected "}", was "{")
[ERR]
[ERR] BUILD FAILED
[ERR] com.sencha.exceptions.ExProcess: compass process exited with non-zero code : 1
[ERR]
[ERR] Total time: 21 seconds
                     [ERR] The following error occurred while executing this line:
/Users/jakeF/dev/SENCHA/MyApp/.sencha/app/build-impl.xml:273: The following error occurred while executing this line:
/Users/jakeF/dev/SENCHA/MyApp/.sencha/app/sass-impl.xml:200: The following error occurred while executing this line:
/Users/jakeF/dev/SENCHA/MyApp/.sencha/app/sass-impl.xml:206: com.sencha.exceptions.ExProcess: compass process exited with non-zero code : 1

My system compass compiles it fine. Just the Sencha build process is breaking things.

My system ruby-

  ruby 2.1.1p76 (2014-02-24 revision 45161) [x86_64-darwin13.0]

Answer 1

I got this response in the Sencha forums: You can specify the path to the version of ruby to use in YouApp/.sencha/app/default.properties

So I added this line in said file:

build.ruby.path=/Users/jakef/.rvm/rubies/ruby-2.1.1/bin/ruby

And it worked!