CODEWITHSUNDEEP
angularjs
user2734839
user2734839

Reputation: 217

ionic-angular components.core.scss error

Just starting with Ionic 2. My first app fails with error:

Error: Import directives may not be used within control directives or mixins. on line 34 of node_modules/ionic-angular/components.core.scss @import "fonts/ionicons";

Anyone encountered this problem and knows how to solve it? Would be very grateful for your help!

Upvotes: 5

Views: 1417

Answers (4)

galvan
galvan

Reputation: 7476

I found a solution for this: One of the dependencies has updated (one that is related to sass). In order to fix this issue without changing the files under node-modules is to use specific versions for gulp-sass and node-sass. Use the following commands:

npm install [email protected]
npm install [email protected]

Upvotes: 6

Valentin Blokhin
Valentin Blokhin

Reputation: 515

This bug fixed in ionic "2.0.0-beta.6" version. You can update or check this commit fix saas errors

Upvotes: 1

tomvo
tomvo

Reputation: 1439

In the current beta (v2.0.0-beta.5) combined with Sass Sass 3.4.13 there seems to be a bug with an @import inside an @if. This is not allowed.

Comment out the @if structure in node_modules/iconic_angular/components.core.scss to look like this:

$ionicons: true !default;
// @if ($ionicons) {
  @import "fonts/ionicons";
// }

On top of that there seems to be an issue with some declarations in the Sass file for windows. If you don't need Windows for now change the sass include defintion in node_modules/ionic-gulp-sass-build/index.js to read (so removing the include for windows).

...
  src: 'app/theme/app.+(ios|md).scss', 
...

Upvotes: 4

Guilherme Silva
Guilherme Silva

Reputation: 1

Go to node_modules/ionic-angular/components.core.scss and set the variable ($ionicons) to false.

Upvotes: -1

Related Questions