Angular ERROR: PostCSS received undefined instead of CSS string

Trying to build an Angular project and I'm getting the errors below. This project built fine last week. I made some changes to other projects that use the Dlls from this project, but no changes to this project. I already spent a lot of time troubleshooting it with no luck and appreciate any help.

ERROR: PostCSS received undefined instead of CSS string An unhandled exception occurred: PostCSS received undefined instead of CSS string

7 Answers

This can sometimes happen if node-sass was compiled for a different version of Node.js than you're currently running (ie if you've recently changed your Node.js version). You can fix that with:

npm rebuild node-sass 

if you are using webpack, and trying to use sass-loader, also add sass

I had this same issue when attempting to test an Angular library, and the issue was I had [``] instead of [] in the styles property of my component metadata.

Wrong

@Component({ selector: 'my-input', template: ` <input ... /> `, styles: [``], 

Right

@Component({ selector: 'my-input', template: ` <input ... /> `, styles: [], 

I had similar problem. I was trying to build an angular library and the message below appeared:

Building Angular Package ------------------------------------------------------------------------------ Building entry point 'library-name' ------------------------------------------------------------------------------ Compiling TypeScript sources through ngc ERROR: PostCSS received undefined instead of CSS string An unhandled exception occurred: PostCSS received undefined instead of CSS string See "/tmp/ng-itlEgm/angular-errors.log" for further details. [12:03:38] 'compile' errored after 17 s [12:03:38] Error: Command `ng build library-name --prod` exited with code 127 at ChildProcess.handleSubShellExit (/node_modules/gulp-run/command.js:166:13) at Object.onceWrapper (events.js:422:26) at ChildProcess.emit (events.js:315:20) at ChildProcess.EventEmitter.emit (domain.js:505:15) at Process.ChildProcess._handle.onexit (internal/child_process.js:275:12) [12:03:38] 'build' errored after 17 s 

I was using gulp-run to execute the command ng build library-name --prod. But, executing the command ng build library-name --prod directly on the terminal, the log error was smaller, but similar too.

The problem was in one component. The component had one styleURL (Angular component decorator), like this:

...component.css

but, the library uses scss. So, I changed the path to:

...component.scss

and I executed the command 'ng build library-name --prod'. So, the error didn't appear again.

I was using NVM v0.35.2 (allow to have more than one NodeJS version installed in my machine); NodeJS v12.18.2; Ubuntu x64 18.0.4 LTS and Angular CLI 9.1.9.

I faced the same situation now and the command that helped me is -

npm i node-sass -D 

Check the node version, see if the version of node changes cause this problem. I use node version 16.14.2 which occured this error, after switch to 12.16.1 it works well. Just check your node-sass and node version will find a way out.

This can happen due to change in version of node. I had same issue with a NUXT app. What I did was

1. using yarn, in the root directory of your project, run yarn. But if you're using npm run npm install
2. start your project again.