Sencha Touch - Undefined mixin 'experimental' on compass compile

Question

When I try to compile my sass code with compass compile I get the following error :

error app.scss (Line 42 of /MyProject/touch/resources/themes/stylesheets/sencha-touch/base/src/_ProgressIndicator.scss: Undefined mixin 'experimental'.)

My sass code is pretty normal, I have :

@import 'sencha-touch/default';
@import 'sencha-touch/default/all';

/* Rest of my css below */

I'm using :
Sencha Touch 2.4 Compass 1.0.1 (Polaris) ruby 2.2.0dev Mac OSX Yosemite

I see the same issue too using Sencha Touch 2.3.1, Ruby 1.9.3, Compass 1.0.1 on windows. Has anyone seen the same issue. Is it related the latest compass version? — Sharan Rajendran, Nov 13 '14 at 14:44
A rough workaround until we find a solution is to use `sencha app watch` on you app's root folder — Mehdiway, Nov 14 '14 at 09:30

score 4 · Answer 1 · edited Jan 27 '15 at 18:09

Adding @import "compass/css3/shared"; to the project's app.scss resolves the error. This import needs to be added before the sencha imports.

For subsequent errors I also had to add:

@import "compass/css3/box";
$experimental-support-for-pie:false;

Versions: Sencha Touch: 2.4.1, Compass 1.0.1, Sass 3.4.9, Ruby 1.9.3

References: http://hugogiraudel.com/2013/03/25/compass-extensions/, http://compass-style.org/reference/compass/css3/box/,

Complete import to resolve the error:

@import "compass/css3/shared";
@import "compass/css3/box";
$experimental-support-for-pie: false;
@import 'sencha-touch/default';
@import 'sencha-touch/default/all';

<-- The rest of your sass -->

Sencha Touch - Undefined mixin 'experimental' on compass compile

1 Answers1