alistairreynolds's avatar

File to import not found or unreadable

I've looked around and found a few solutions to this, but none match what I need.

{ Error: resources/assets/sass/app.scss
Error: File to import not found or unreadable: main-site/modules/colorPicker
        Parent style sheet: /home/alistair-r/resources/assets/sass/app.scss
    on line 12 of resources/assets/sass/app.scss

Things already looked at & other points:

  • Ran composer update, composer dump-autoload, and npm install
  • The 'main-site' folder is inside the same folder as my app.scss folder
  • My app.scss is in the assets/sass directory
  • app.scss is just a list of @imports
  • This works locally on my dev machine
  • It complies other sass files OK, just nothing with an @import in it

Here's my gulp file:

var elixir = require('laravel-elixir');

/*
 |--------------------------------------------------------------------------
 | Elixir Asset Management
 |--------------------------------------------------------------------------
 |
 | Elixir provides a clean, fluent API for defining some basic Gulp tasks
 | for your Laravel application. By default, we are compiling the Sass
 | file for our application, as well as publishing vendor resources.
 |
 */

elixir(function (mix) {

    // Process sass and mix the vendor stylesheets together
    mix.styles('vendor', 'public/css/vendor.css')
        .sass('main-site/separate/siteInfoPdf.scss', 'public/css/site-info-pdf.css')
        .sass('app.scss');

Anyone have any idea, because I'm stumped

0 likes
1 reply
alistairreynolds's avatar
Level 8

Naturally, right after I post, I find the solution after some guess work...

Seems the server doesn't like hyphens in directory names. Changed it from a hyphen to an underscore and all worked happily after that.

Also had another problem with one of the files not having the same case as the @import string, so two possible solutions if someone has the same issue.

Please or to participate in this conversation.