Ionic-app-scripts: Sass error (undefined variable "$item-md-body-text-font-size") after update

Created on 15 May 2017  路  7Comments  路  Source: ionic-team/ionic-app-scripts

_From @Screeze on May 13, 2017 12:7_

Ionic version: (check one with "x")
[x] 3.x

I'm submitting a ... (check one with "x")
[x ] bug report

After updating ionic, I get following error when building:

[15:02:00]  sass: ...ng/xx/xx/node_modules/ionic-angular/components/label/label.md.scss, line: 24 
            Undefined variable: "$item-md-body-text-font-size".

      L23:  [text-wrap] .label-md {
      L24:    font-size: $item-md-body-text-font-size;
      L25:    line-height: $item-md-body-text-line-height;

Error: Failed to render sass to css

I have found the variable to be defined in xx\node_modules\ionic-angular\components\item\item.md.scss but somehow it seems this file is not included in the build.

I first posted this in the forum (https://forum.ionicframework.com/t/sass-error-after-update/90087) and seems like I am not the only one with that problem.

edit:
This only happens when building for Android, not when using ionic serve!

edit2:
This does not happen when "--prod" flag is NOT added to the build. This seems only to occur with "--prod" enabled.

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

>ionic info

global packages:

    @ionic/cli-utils : 1.0.0
    Cordova CLI      : 7.0.1
    Ionic CLI        : 3.0.0

local packages:

    @ionic/app-scripts              : 1.3.7
    @ionic/cli-plugin-cordova       : 1.0.0
    @ionic/cli-plugin-ionic-angular : 1.0.0
    Ionic Framework                 : ionic-angular 3.2.0

System:

    Node       : v7.9.0
    OS         : Windows 10
    Xcode      : not installed
    ios-deploy : not installed
    ios-sim    : not installed

_Copied from original issue: driftyco/ionic#11648_

css v3

Most helpful comment

I have a solution in the file src/theme/variables.scss I add the next lines:
$item-md-body-text-line-height: 4em;
$item-md-body-text-font-size: 4em;
And all its solved;

All 7 comments

_From @AmitMY on May 13, 2017 23:58_

Please try v3.2.1, as it fixes some AoT issues that exist in v3.2.0

_From @Screeze on May 14, 2017 1:45_

I just tried, but still the same result, now using v3.2.1

Thanks for opening an issue with us, we will look into this.

global packages:

@ionic/cli-utils : 1.0.0
Cordova CLI      : 7.0.1 
Ionic CLI        : 3.0.0

local packages:

@ionic/app-scripts              : 1.3.7
@ionic/cli-plugin-cordova       : 1.0.0
@ionic/cli-plugin-ionic-angular : 1.0.0
Ionic Framework                 : ionic-angular 3.2.1

System:

Node       : v7.9.0
OS         : macOS Sierra
Xcode      : Xcode 8.3.2 Build version 8E2002 
ios-deploy : 1.9.1 
ios-sim    : 5.0.13

I got the same error updating to 3.2.1 only run the --prod in android

I have a solution in the file src/theme/variables.scss I add the next lines:
$item-md-body-text-line-height: 4em;
$item-md-body-text-font-size: 4em;
And all its solved;

thank you @rogeliotrejo13 your reply was very useful to me.

With Ionic CLI version 3.4.0, also got this error.
I solved this error with @rogeliotrejo13 's reply temporary.
Is this is a bug in ionic build script with --prod option?

Was this page helpful?
0 / 5 - 0 ratings