TypeError: Cannot read property 'split' of undefined at getRenderFuncFromSassImpl

[ucswift]

Description:
On trying to issue commands like ionic serve The error [ng] ｢wdm｣: Failed to compile.

Steps to Reproduce:
Install latest Ionic, run ionic start, use the Ionic 4 beta, any option for Cordova will work and any option for ionic pro will work. Change directory to your new app and run ionic serve and the error will appear.

Output:

[ng] chunk {48} 48.js, 48.js.map () 21.8 kB  [rendered]
[ng] chunk {49} 49.js, 49.js.map () 21.9 kB  [rendered]
[ng] chunk {50} 50.js, 50.js.map () 21.9 kB  [rendered]
[ng] chunk {51} 51.js, 51.js.map () 21.9 kB  [rendered]
[ng] chunk {52} 52.js, 52.js.map () 23.5 kB  [rendered]
[ng] chunk {53} 53.js, 53.js.map () 23.5 kB  [rendered]
[ng]
[ng] ERROR in ./src/global.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--15-3!./src/global.scss)
[ng] Module build failed (from ./node_modules/sass-loader/lib/loader.js):
[ng] TypeError: Cannot read property 'split' of undefined
[ng]     at getRenderFuncFromSassImpl (/Users/shawn/Documents/dev/Paylocity/ionic4/IonicTest/node_modules/sass-loader/lib/loader.js:88:29)
[ng]     at Object.sassLoader (/Users/shawn/Documents/dev/Paylocity/ionic4/IonicTest/node_modules/sass-loader/lib/loader.js:46:20)
[ng] ERROR in ./src/theme/variables.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--15-3!./src/theme/variables.scss)
[ng] Module build failed (from ./node_modules/sass-loader/lib/loader.js):
[ng] TypeError: Cannot read property 'split' of undefined
[ng]     at getRenderFuncFromSassImpl (/Users/shawn/Documents/dev/Paylocity/ionic4/IonicTest/node_modules/sass-loader/lib/loader.js:88:29)
[ng]     at Object.sassLoader (/Users/shawn/Documents/dev/Paylocity/ionic4/IonicTest/node_modules/sass-loader/lib/loader.js:46:20)
[ng] chunk {54} 54.js, 54.js.map () 26.8 kB  [rendered]
[ng] chunk {55} 55.js, 55.js.map () 27.6 kB  [rendered]
[ng] chunk {56} 56.js, 56.js.map () 23.8 kB  [rendered]
[ng] chunk {57} 57.js, 57.js.map () 24.1 kB  [rendered]
[ng] chunk {58} 58.js, 58.js.map () 21.6 kB  [rendered]
...snip...
[ng] chunk {157} 157.js, 157.js.map () 7.32 kB  [rendered]
[ng] chunk {158} 158.js, 158.js.map () 3.51 kB  [rendered]
[ng] chunk {159} 159.js, 159.js.map () 3.58 kB  [rendered]
[ng] chunk {160} 160.js, 160.js.map () 2.36 kB  [rendered]
[ng] chunk {161} 161.js, 161.js.map () 14.7 kB  [rendered]
[ng] chunk {162} 162.js, 162.js.map () 8.11 kB  [rendered]
[ng] chunk {163} 163.js, 163.js.map () 1.39 kB  [rendered]
[ng] chunk {164} 164.js, 164.js.map () 1.39 kB  [rendered]
[ng] chunk {165} 165.js, 165.js.map () 5.15 kB  [rendered]
[ng] ℹ ｢wdm｣: Failed to compile.

My ionic info:

Ionic:

   ionic (Ionic CLI)             : 4.2.1 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.0-beta.13
   @angular-devkit/build-angular : 0.8.6
   @angular-devkit/schematics    : 0.8.6
   @angular/cli                  : 6.2.6
   @ionic/angular-toolkit        : 1.0.0

System:

   NodeJS : v8.11.2 (/usr/local/bin/node)
   npm    : 5.6.0
   OS     : macOS High Sierra

Other Information:
I have not tried the following from a Windows box yet, so unsure if it's just the Linux\Mac env. I've cached cleaned, restarted, etc and none have helped the issue. I also commented on Issue #3697 as it presents the same way, but npx ng serve works on that issue and not this one.

[Pranjalich]

Hello, I am facing the same problem in Ubuntu 16.04 64 bit. Is your issue solved?

[finrojo]

I have spent a whole day trying to resolve this one too. Did you get past it?

[ellyofreitas]

I have the same problem, is there a solution?

[sbadio]

Same issue ever since I updated to from Angular 5. I'm not sure if it's related but haven't been able to build an ionic or angular project since.

`Ionic:

ionic (Ionic CLI) : 4.10.3 (C:\Users...\node_modules\ionic)
Ionic Framework : @ionic/angular 4.0.1
@angular-devkit/build-angular : 0.12.4
@angular-devkit/schematics : 7.2.4
@angular/cli : 7.2.4
@ionic/angular-toolkit : 1.4.0

System:

NodeJS : v10.15.1 (C:\Program Files\nodejs\node.exe)
npm : 6.4.1
OS : Windows 10`

[finrojo]

Has anyone been able to get past this?

[finrojo]

doing the following fixed the problem for me.

npm install --save-dev sass
npm install --save-dev node-sass

[TransporterCL]

works for me, thanks @finrojo

[McLutzifer]

doing the following fixed the problem for me.

npm install --save-dev sass
npm install --save-dev node-sass

wow @finrojo, thank you very much - i spent half a day searching for a solution

[imhoffd]

Looks like this is related to node-sass. You can take a look at the troubleshooting options in this comment: #3842 (comment)