sass error

[nelsonec87]

Hi, I installed ionic2 cli npm install -g ionic@beta and created a new project ionic start cutePuppyPics --v2, following the official website.
then ionic serve. I got

Running 'serve:before' gulp task before serve
[23:07:29] Starting 'clean'...
[23:07:29] Finished 'clean' after 9.51 ms
[23:07:29] Starting 'watch'...
[23:07:29] Starting 'sass'...
[23:07:29] Starting 'html'...
[23:07:29] Starting 'fonts'...
[23:07:29] Starting 'scripts'...
[23:07:29] Finished 'scripts' after 71 ms
node_modules\ionic-angular\components.core.scss
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";
--^

And the page opens in the browser without css.. if I comment the line 33 (the if), it runs ok..

Your system information:
Cordova CLI: 5.3.1
Ionic Framework Version: 2.0.0-beta.4
Ionic CLI Version: 2.0.0-beta.25
Ionic App Lib Version: 2.0.0-beta.15
OS:
Node Version: v4.0.0

[nunoarruda]

Same here:

Probably related to sass/libsass#1724. I think you guys just need to update your gulp-sass version.

[RunningV]

same as upstair. i found line 34 @import "fonts/ionicons"; is useless. i comment

 @import "fonts/ionicons";

,and style is ok.
it seems works but alse comes another errorError: Undefined variable: "$color-contrast".
on line 88 of node_modules/ionic-angular/components/tabs/tabs.wp.scss

  color: $color-contrast;

it likes the ionic-angular has some bug

[susanlinsfu]

+1 can't run ionic, no style at all, app becomes unusable. Seems like a showstopper.

[messense]

same error

[brandyscarney]

Hey everyone, sorry you're running into this. Could you run the following commands:

npm install gulp-sass@2.2.0
npm install node-sass@3.4.2

and then run ionic serve again and let me know if that fixes the error?

[messense]

@brandyscarney Yes, it fixes the error.

[mco67]

@brandyscarney Problem solve for me too, thx

[quanghoc]

Is there a way NOT to download the latest build each time when I do ionic start?

I see random errors here and there each day because for some reason, that day has a bad build and ionic start would pick up and fill the entire project with bugs.

It's better if ionic start can point to a proven and stable build.

[faelos]

Above fix has not resolved the issue for me :(

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.4
Ionic CLI Version: 2.0.0-beta.25
Ionic App Lib Version: 2.0.0-beta.15
ios-deploy version: 1.8.6
ios-sim version: 4.1.1
OS: Mac OS X El Capitan
Node Version: v0.12.7
Xcode version: Xcode 7.3 Build version 7D175

[quanghoc]

Do you have a working Ionic 2 project? Just replace the folder ionic-gulp-sass-build.

But my point is that this will happen again with ionic start on a random day. It's systematic.

[901F]

@brandyscarney not for me same error

Cordova CLI: 6.0.0
Gulp version: CLI version 3.9.0
Gulp local: Local version 3.9.1
Ionic Framework Version: 2.0.0-beta.4
Ionic CLI Version: 2.0.0-beta.25
Ionic App Lib Version: 2.0.0-beta.15
ios-deploy version: 1.8.2
ios-sim version: 5.0.3
OS: Mac OS X El Capitan
Node Version: v4.1.2
Xcode version: Xcode 7.3 Build version 7D175

[DILEEP-YADAV]

hi! @brandyscarney

please update dependency with starter project
npm install gulp-sass@2.2.0
npm install node-sass@3.4.2

[pixelmanya]

@LastStarfi9hter For me neither. But then I added gulp-sass and node-sass to package.json and removed the node_modules directory completely. After that npm install and everything is working as expected.

[DILEEP-YADAV]

I know !
I am talking about ionic starter project. They should be update. every one facing problem with this new update.

thanks

[pixelmanya]

@DILEEP-YADAV Sure, this is just a workaround. I bet @brandyscarney and her team are taking care of this issue…

[DILEEP-YADAV]

@pixelmanya

thanks

[galvanu]

Thanks,
Works for me.

[jgw96]

Hey everyone! So if you install the latest ionic-angular@nightly there is a fix for this issue now!

[tlancina]

Hey all, sorry for the headache. Gulp-sass has a caret dependency on node-sass, which got a pretty big update last night that started erroring on things that weren't previously erroring before. Yay semver!

Should be fixed in all of the starters, which have been updated to the latest nightly version of beta.5 where it's fixed. As always, let us know if you're still having problems, thanks!

[aaronksaunders]

not sure what the fix is here for existing projects?

[tlancina]

The Sass causing the error has been fixed in beta.6, so just updating
ionic-angular should resolve it.

If you need to stay on a previous version, you'll need to downgrade to
node-sass 3.4.1 I believe. If you're using npm3 you can install it from
your project root and it should work fine, otherwise for npm 2 you would
need to navigate to
node_modules/ionic-gulp-sass-build/node_modules/gulp-sass/ and install it
there.
On Thu, Apr 21, 2016 at 7:37 PM Aaron K Saunders notifications@github.com
wrote:

not sure what the fix is here for existing projects?

—
You are receiving this because you modified the open/close state.
Reply to this email directly or view it on GitHub
#6258 (comment)

[DILEEP-YADAV]

One another new update beta.6 with starter is by default Material Design (Android Look and feel ) instead iOS.

Real Great for android first !

[nunoarruda]

https://medium.com/@xzyfer/why-node-sass-broke-your-code-and-semver-1b3e409c57b9