SCSS problem "File to import not found or unreadable: compass/css3/transition"

[Comus Sola]

I need to edit a website that was built a couple of years ago. However, when I try to update the css file from scss I get the result. It was working fine until recently the only change is that site has become "https" rather than plain old "http".

I'm way out my depth here so any help much appreciated!

/*

Error: File to import not found or unreadable: compass/css3/transition.

       Load paths:

         /Applications/Adobe Dreamweaver CC 2017/Configuration/SassFrameworks/bourbon

         /Applications/Adobe Dreamweaver CC 2017/Configuration/SassFrameworks/neat

         /Applications/Adobe Dreamweaver CC 2017/Configuration/SassFrameworks/base

        on line 2 of /Users/julian/Public/Drop Box/JULIAN/websites/xxx/public_html/wp-content/themes/xxx/scss/screen.scss

1: /* Scss Document *\/

2: @Import "compass/css3/transition";

3:

4: /*  -----------------------------

5:     ICOMOON

6:     ----------------------------- *\/

7:  @Blissful_help0D4E-face {

Backtrace:

/Users/julian/Public/Drop Box/JULIAN/websites/access_new_11_16/public_html/wp-content/themes/wave_access/scss/screen.scss:2

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/import_node.rb:67:in `rescue in import'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/import_node.rb:45:in `import'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/import_node.rb:28:in `imported_file'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/import_node.rb:37:in `css_import?'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/perform.rb:311:in `visit_import'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/base.rb:36:in `visit'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/perform.rb:158:in `block in visit'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/stack.rb:79:in `block in with_base'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/stack.rb:115:in `with_frame'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/stack.rb:79:in `with_base'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/perform.rb:158:in `visit'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/base.rb:52:in `block in visit_children'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/base.rb:52:in `map'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/base.rb:52:in `visit_children'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/perform.rb:167:in `block in visit_children'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/perform.rb:179:in `with_environment'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/perform.rb:166:in `visit_children'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/base.rb:36:in `block in visit'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/perform.rb:186:in `visit_root'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/base.rb:36:in `visit'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/perform.rb:157:in `visit'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/visitors/perform.rb:8:in `visit'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/root_node.rb:36:in `css_tree'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/tree/root_node.rb:20:in `render'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/engine.rb:278:in `render'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/exec/sass_scss.rb:420:in `run'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/exec/sass_scss.rb:63:in `process_result'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/exec/base.rb:52:in `parse'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/lib/sass/exec/base.rb:19:in `parse!'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/rubygems/gems/sass-3.4.19/bin/sass:13:in `<top (required)>'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/bin/sass:30:in `load'

/Applications/Adobe Dreamweaver CC 2017/Adobe Dreamweaver CC 2017.app/Contents/Resources/gems/bin/sass:30:in `<main>'

*/

body:before {

  white-space: pre;

  font-family: monospace;

  content: "Error: File to import not found or unreadable: compass/css3/transition.\A        Load paths:\A          /Applications/Adobe Dreamweaver CC 2017/Configuration/SassFrameworks/bourbon\A          /Applications/Adobe Dreamweaver CC 2017/Configuration/SassFrameworks/neat\A          /Applications/Adobe Dreamweaver CC 2017/Configuration/SassFrameworks/base\A         on line 2 of /Users/julian/Public/Drop Box/JULIAN/websites/access_new_11_16/public_html/wp-content/themes/wave_access/scss/screen.scss\A \A 1: /* Scss Document */\A 2: @Import \"compass/css3/transition\";\A 3: \A 4: /*  -----------------------------\A 5:     ICOMOON\A 6:     ----------------------------- */\A 7:  @Blissful_help0D4E-face {"; }

[BenPleysier · Accepted solution]

It looks like the original SCSS was compiled using Bourbon, Neat and Base modules. You should be able to figure that out by having a look at *.rb in the root directory of the site.

As far as the first two are concerned, you can install the modules using the Site Setup as in

As far as Base is concerned, you will most likely have to install that from scss-base

If you do not have a good knowledge of Sass, stay away from it and create an overriding CSS style sheet for your changes.

[Comus Sola]

Thanks!

I guess I have a very good knowledge of how to use Sass as a front end designer but only a sketchy knowledge of how it is installed and so on. I set it up on my computer several years ago with OSX Terminal, it took ages to get right as I knew nothing about Ruby and Gems, and since then it has just "worked". It worked when I used Terminal to compile the Sass, and also when I used Compass and then Scout. It is only since I have started trying to do it directly in Dreamweaver that I have had difficulties of this kind.

Anyway, I will give this a try. Fortunately, I only have this problem with one site so far.

[Guest]

wow what a great tip. If you don't know it stay away from it!

Comus, did you get rid of the problem? I'm trying to do an import but always get the same error "File to import not found or unreadable"

[Nebulous_Dawn]

If I remember correctly, the problem was that some of the scss was using Compass code that stopped working (and broke everything else) when I stopped using Compass to write my scss. Once I removed the offending lines of code it all worked happily... I think!

The info about Bourbon, Neat and Base modules was beyond my level of understanding as more of a front-endy person, and sadly went straight over my head!