Ionic-gulp-sass-build - Error: File to import not found or unreadable: ionic.ios

When I want to generate sass sourcemap I have an error:

    Error: File to import not found or unreadable: ionic.ios                                                                                                                                                                
           Parent style sheet: stdin                                                                                                                                                                                        
            on line 19 of stdin                                                                                                                                                                                             
    >> @import "ionic.ios"; 

I have ionic-cli 2.0.0-beta.24 and here is gulp task:

gulp.task('sass', function(){
  return buildSass({
    dest: 'www/build/css',
    sassOptions: {
      sourceMap: true,
      outFile: 'www/build/css'

Why this not work?

Please update your version of ionic. This was fixed in beta 6 i believe.

I already have beta 6.

   "dependencies": {
     "angular2": "2.0.0-beta.15",
     "angular2-moment": "^0.5.0",
     "es6-promise": "3.1.2",
     "es6-shim": "^0.35.0",
     "ionic-angular": "2.0.0-beta.6",
     "ionic-native": "^1.1.1",
     "ionicons": "3.0.0",
     "lodash": "^4.11.1",
     "moment": "^2.13.0",
     "reflect-metadata": "0.1.2",
     "rxjs": "5.0.0-beta.2",
     "zone.js": "0.6.12"
   "devDependencies": {
     "del": "2.2.0",
     "gulp": "3.9.1",
     "gulp-watch": "4.3.5",
     "ionic-gulp-browserify-typescript": "^1.0.1",
     "ionic-gulp-fonts-copy": "^1.0.0",
     "ionic-gulp-html-copy": "^1.0.0",
     "ionic-gulp-sass-build": "^1.0.0",
     "ionic-gulp-scripts-copy": "^1.0.1"
   "cordovaPlugins": [
   "cordovaPlatforms": [
       "platform": "ios",
       "version": "",
       "locator": "ios"

I have the same problem in OSX, under windows, the same project works fine, when I try to do something with ionic CLI

ionic serve

There is an error in your gulpfile: 
Error: ENOENT, no such file or directory '/Users/dev/Projects/APP/node_modules/ionic-gulp-sass-build/node_modules/gulp-sass/node_modules/node-sass/vendor'
    at Error (native)
    at Object.fs.readdirSync (fs.js:761:18)
    at Object.getInstalledBinaries (/Users/dev/Projects/AOS42_AOV_APP/node_modules/ionic-gulp-sass-build/node_modules/gulp-sass/node_modules/node-sass/lib/extensions.js:60:13)
    at foundBinariesList (/Users/dev/Projects/AOS42_AOV_APP/node_modules/ionic-gulp-sass-build/node_modules/gulp-sass/node_modules/node-sass/lib/errors.js:19:15)
    at foundBinaries (/Users/dev/Projects/AOS42_AOV_APP/node_modules/ionic-gulp-sass-build/node_modules/gulp-sass/node_modules/node-sass/lib/errors.js:14:5)
    at Object.module.exports.missingBinary (/Users/dev/Projects/AOS42_AOV_APP/node_modules/ionic-gulp-sass-build/node_modules/gulp-sass/node_modules/node-sass/lib/errors.js:44:5)
    at Object.<anonymous> (/Users/dev/Projects/AOS42_AOV_APP/node_modules/ionic-gulp-sass-build/node_modules/gulp-sass/node_modules/node-sass/lib/index.js:14:28)
    at Module._compile (module.js:460:26)
    at Object.Module._extensions..js (module.js:478:10)
    at Module.load (module.js:355:32)

@matijas @xavibel Could you provide more details, e.g. run ionic info and paste the output here?

Now it’s working. I deleted node_modules folder and did npm install and all it’s working, maybe some packages not has been installed correctly.


1 Like

Thanks for the update, I’m glad you figured it out!

Deleting node_modules not help for me, here is the output

Your system information:

Cordova CLI: 6.1.1
Gulp version:  CLI version 3.9.1
Gulp local:   Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.6
Ionic CLI Version: 2.0.0-beta.25
Ionic App Lib Version: 2.0.0-beta.15
OS: Distributor ID:     LinuxMint Description:  Linux Mint 17.3 Rosa 
Node Version: v4.4.2

@matijas Are you getting the error always or only with the sourceMap: true option?

I have this error in both cases.

I just took a look at the source code of the sass-build task and it seems that there’s a bug - the nested options are not merged but overwritten (which results in not properly resolved paths). I already made a PR that should fix the problem. As a workaround, you could modify your task to pass the default options as well:

gulp.task('sass', function(){
  return buildSass({
    dest: 'www/build/css',
    sassOptions: {
      includePaths: [
      sourceMap: true,
      outFile: 'www/build/css'

Ok, now building works, but source map is not generated and source css is not visible in debugger.

In www/build/css/ last line is:
/*# */
but source map file not exist :frowning:

According to this
ionic-gulp-tasks ( ) should include extra pipe to generate sourcemap.

1 Like

@matijas Thanks for the update! It seems like a bug. Could you please open an issue about it?

Done :slight_smile: