Compass编译错误Sencha Touch 2.2.1，未定义$ font-family值和mixin问题 [英] Compass compile error on Sencha Touch 2.2.1, undefined $font-family value and mixin problems

问题描述

使用Sencha Touch 2.2使用本教程。 1，由于未定义的 $ font-family 变量，我无法编译我的项目：

 错误application.scss（_Class.scss的第2行：未定义的变量：$ font-family）
 Sass :: SyntaxError在$ b $的第[2] b / Users / mac / Sites / apps / MyApp / touch / resources / themes / stylesheets / sencha- 
 touch / default / src / _Class.scss：未定义的变量：$ font-family。 
  

有没有人知道如何解决这个问题？

注意：这是一个

application.scss

$ b $ h b

  1 $ base-color：＃7A1E08; 
 2 $ base-gradient：'glossy'; 
 3 
 4 @import'sencha-touch / default / all'; 
 5 
 6 @include sencha-panel; 
 7 @include sencha-buttons; 
 8 @include sencha-sheet; 
 9 @include sencha-picker; 
 10 @include sencha-toolbar-forms; 
 11 @include sencha-tabs; 
 12 @include sencha-toolbar; 
 13 @include sencha-carousel; 
 14 @include sencha-indexbar; 
 15 @include sencha-list; 
 16 @include sencha-layout; 
 17 @include sencha-form; 
 18 @include sencha-loading-spinner; 
  

注意：安装了Ruby 1.9.3p448。

解决方案

我发现如何解决这个问题。

2.2.1文档从Sencha Touch 2.1升级主题到2.2 < a> stay：

要注意的最重要的变化是对每个组件使用
mixins。 / p>

。他们改变了使用@import而不是@include包含组件的方式，例如：

  @import'sencha-touch / default / src / Panel'; 
  

也注意到文档使用 @import'sencha-touch / default / Panel'; 但正确的方法是添加src / _the_component_目录例如 @import'sencha-touch / default / src / Panel';

我也没有创建新目录与config.rb和theme.scss。我只是修改了已经存在于my_app / resources / sass / app.scss中的app.scss文件

然后在sass目录下，使用终端我使用<$ c $

这是我的代码：

<$> p $ p> ＃apps.scss
$ base-color：＃af2584;

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


@import'sencha-touch / default / src / Button';
@import'sencha-touch / default / src / Panel';
@import'sencha-touch / default / src / Sheet';
@import'sencha-touch / default / src / MessageBox';
@import'sencha-touch / default / src / Toolbar';
@import'sencha-touch / default / src / carousel / Carousel';


Using this tutorial with Sencha Touch 2.2.1, I'm not able to compile my project because of an undefined $font-family variable:

error application.scss (Line 2 of _Class.scss: Undefined variable: "$font-family".) 
Sass::SyntaxError on line ["2"] of 
/Users/mac/Sites/apps/MyApp/touch/resources/themes/stylesheets/sencha-
touch/default/src/_Class.scss: Undefined variable: "$font-family".

Does anyone have an idea how to solve this?

Note: This was a bug in the previous version (Sencha Touch 2.2).

application.scss

  1 $base-color: #7A1E08;
  2 $base-gradient: 'glossy';
  3 
  4 @import 'sencha-touch/default/all';
  5  
  6  @include sencha-panel;
  7  @include sencha-buttons;
  8  @include sencha-sheet;
  9  @include sencha-picker;
 10  @include sencha-toolbar-forms;
 11  @include sencha-tabs;
 12  @include sencha-toolbar;
 13  @include sencha-carousel;
 14  @include sencha-indexbar;
 15  @include sencha-list;
 16  @include sencha-layout;
 17  @include sencha-form;
 18  @include sencha-loading-spinner;

NOTE: I have Ruby 1.9.3p448 installed.

解决方案

I found how to solve this problem.

looking at the sencha-touch 2.2.1 docs on the Upgrading Themes From Sencha Touch 2.1 to 2.2 stay:

The most important change to be aware of is the move away from using mixins for each component.

with that say. They changed the way to include components using @import instead of @include like this:

@import 'sencha-touch/default/src/Panel';

also notice that the docs use @import 'sencha-touch/default/Panel'; but the right way to do it is adding the src/_the_component_ directory e.g. @import 'sencha-touch/default/src/Panel';

I also didn't create a new directory with the config.rb and theme.scss. I just modified the app.scss file that already exists in my_app/resources/sass/app.scss

Then under the sass directory with the terminal I used $ compass compile and finally works.

Here is my code:

# apps.scss
$base-color: #af2584;

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


@import 'sencha-touch/default/src/Button';
@import 'sencha-touch/default/src/Panel';
@import 'sencha-touch/default/src/Sheet';
@import 'sencha-touch/default/src/MessageBox';
@import 'sencha-touch/default/src/Toolbar';
@import 'sencha-touch/default/src/carousel/Carousel';

这篇关于Compass编译错误Sencha Touch 2.2.1，未定义$ font-family值和mixin问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！