1. #1
    Sencha User
    Join Date
    Jul 2011
    Posts
    31
    Vote Rating
    0
    Answers
    2
    master_obiwan is on a distinguished road

      0  

    Default Unanswered: File to import not found or unreadable: recipes/background

    Unanswered: File to import not found or unreadable: recipes/background


    Specs:
    1. Mac OSX Lion 10.7.4
    2. Compass version: Compass 0.12.1
    3. SASS version: 3.1.19
    4. sencha touch: sencha-touch-2.0.1.1
    5. sencha command: v2.0.2

    Hey Sencha folks I was wondering if anyone could help me with this problem I am having. In terminal while watching and compiling I get this error:

    Error:
    error sass/app.scss (Line 2 of sass/../../sdk/resources/themes/stylesheets/sencha-touch/default/core/../_mixins.scss: File to import not found or unreadable: recipes/background.

    This is preventing me from modifying or creating my own themes and have went through similar problems on the forums with out any luck. If anyone can please take a look at this problem I am having that will be greatly appreciated. I am also providing my config.rb, scss and a screenshot of my project structure. Seems like the tutorials on the sencha site have different folder structures than the framework that I downloaded.

    config.rb code
    Code:
    # Get the directory that this configuration file exists in
    dir = File.dirname(__FILE__)
    
    
    # Load the sencha-touch framework automatically.
    load File.join(dir, '..', '..', 'sdk', 'resources', 'themes')
    
    
    # Compass configurations
    sass_path = dir
    css_path = File.join(dir, "..", "css")
    
    
    # Require any additional compass plugins here.
    images_dir = File.join(dir, "..", "images")
    output_style = :compressed
    environment = :production

    Import from sass/app.scss:
    Code:
    @import '../../sdk/resources/themes/stylesheets/sencha-touch/default/all';
    @include sencha-panel;
    @include sencha-buttons;
    @include sencha-sheet;
    @include sencha-picker;
    @include sencha-tabs;
    @include sencha-toolbar;
    @include sencha-toolbar-forms;
    @include sencha-indexbar;
    @include sencha-list;
    @include sencha-layout;
    @include sencha-carousel;
    @include sencha-form;
    @include sencha-msgbox;
    
    
    // test
    $base-color: #000;
    $active-color: #CCC;


    Project Structure:
    project_structure.png

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,641
    Vote Rating
    898
    Answers
    3573
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Try changing

    Code:
    @import '../../sdk/resources/themes/stylesheets/sencha-touch/default/all';
    to

    Code:
    @import 'sencha-touch/default/all';
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Aug 2011
    Posts
    88
    Vote Rating
    0
    Answers
    3
    Marc-QNX is on a distinguished road

      0  

    Default


    I had the same problem today.

    The solution was that I forgot to update my config.rb file to 2.0.1.1

  4. #4
    Sencha User
    Join Date
    Jul 2011
    Posts
    31
    Vote Rating
    0
    Answers
    2
    master_obiwan is on a distinguished road

      0  

    Default


    That's what I originally had and it gave me this error.

    Code:
    error sass/app.scss (Line 2: File to import not found or unreadable: sencha-touch/default/all.

  5. #5
    Sencha User
    Join Date
    Jul 2011
    Posts
    31
    Vote Rating
    0
    Answers
    2
    master_obiwan is on a distinguished road

      0  

    Default


    Hey Marc-QNX, how do I update the config.rb to 2.0.1.1?

  6. #6
    Sencha User
    Join Date
    Jul 2011
    Posts
    31
    Vote Rating
    0
    Answers
    2
    master_obiwan is on a distinguished road

      0  

    Default Really having a problem getting this issue fixed any help would be awesome

    Really having a problem getting this issue fixed any help would be awesome


    Ok folks don't know why this is giving me such a hard time. I have tried just about anything I could find online and on this forum with no luck. Please any help would be greatly appreciated.

    Out of the box with sencha I get this in the config.rb

    Code:
    # Get the directory that this configuration file exists in
    dir = File.dirname(__FILE__)
    
    
    # Load the sencha-touch framework automatically.
    load File.join(dir, '..', '..', 'sdk', 'resources', 'themes')
    
    
    # Compass configurations
    sass_path = dir
    css_path = File.join(dir, "..", "css")
    
    
    # Require any additional compass plugins here.
    images_dir = File.join(dir, "..", "images")
    output_style = :compressed
    environment = :production
    And in the app.scss I import the following:
    Code:
    @import 'sencha-touch/default/all';
    @include sencha-panel;
    @include sencha-buttons;
    @include sencha-sheet;
    @include sencha-picker;
    @include sencha-tabs;
    @include sencha-toolbar;
    @include sencha-toolbar-forms;
    @include sencha-indexbar;
    @include sencha-list;
    @include sencha-layout;
    @include sencha-carousel;
    @include sencha-form;
    @include sencha-msgbox;

    The error I get from this is as follows:
    error sass/app.scss (Line 2: File to import not found or unreadable: sencha-touch/default/all.


    I noticed that the paths are different so I changed the import to this
    Code:
    @import '../../sdk/resources/themes/stylesheets/sencha-touch/default/all';
    which resulted in this error:
    Code:
    error sass/app.scss (Line 2 of sass/../../sdk/resources/themes/stylesheets/sencha-touch/default/core/../_mixins.scss: File to import not found or unreadable: recipes/background.

    Again really just want to start creating some cool stuff but I can't seem to get past this issue. Is there something I am missing here?

  7. #7
    Sencha User
    Join Date
    Jul 2011
    Posts
    31
    Vote Rating
    0
    Answers
    2
    master_obiwan is on a distinguished road

      0  

    Default Entire error message in terminal

    Entire error message in terminal


    username$ compass watch
    >>> Change detected at 00:55:51 to: app.scss
    error sass/app.scss (Line 2 of sass/../../sdk/resources/themes/stylesheets/sencha-touch/default/core/../_mixins.scss: File to import not found or unreadable: recipes/background.
    Load paths:
    /Users/username/Sites/appName/resources/sass
    /Users/username/.rvm/gems/ruby-1.9.3-p0/gems/compass-0.12.1/frameworks/blueprint/stylesheets
    /Users/username/.rvm/gems/ruby-1.9.3-p0/gems/compass-0.12.1/frameworks/compass/stylesheets
    Compass::SpriteImporter)
    identical stylesheets/app.css
    >>> Compass is polling for changes. Press Ctrl-C to Stop.

  8. #8
    Touch Premium Member
    Join Date
    Jan 2011
    Posts
    55
    Vote Rating
    1
    Answers
    3
    maddhippy is on a distinguished road

      0  

    Default


    I'm not sure, but my download of ST2 doesn't have an sdk folder in it.

    Screen Shot 2012-06-19 at 11.31.23 AM.png

    So, my config.rb in the resources/sass directory is :

    Code:
    # Get the directory that this configuration file exists in
    dir = File.dirname(__FILE__)
    
    
    # Load the sencha-touch framework automatically.
    load File.join(dir, '..', 'themes')
    
    
    # Compass configurations
    sass_path    = dir
    css_path     = File.join(dir, "..", "css")
    environment  = :production
    output_style = :compressed
    Try running compass compile from that directory instead.

  9. #9
    Sencha User
    Join Date
    Jul 2011
    Posts
    31
    Vote Rating
    0
    Answers
    2
    master_obiwan is on a distinguished road

      0  

    Default The SDK directory comes from when you generate a new project

    The SDK directory comes from when you generate a new project


    So for example I cd into the sencha framework and then when you generate a new project like this:

    Code:
    sencha generate app test_v1 ../test_v1
    When you generate the app it creates the directory that contains the sdk directory.

  10. #10
    Sencha User
    Join Date
    Jul 2011
    Posts
    31
    Vote Rating
    0
    Answers
    2
    master_obiwan is on a distinguished road

      0  

    Default Does anyone have an idea why I am getting this error and how I can begin to customize

    Does anyone have an idea why I am getting this error and how I can begin to customize


    I literally followed these sencha tutorials step by step.

    1. http://docs.sencha.com/touch/2-0/#!/...etting_started

    2. Then I tried following this tutorial to begin to add custom styles

    3. http://docs.sencha.com/touch/2-0/#!/guide/theming

    If anyone out there can provide some help that would be great.