47

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 7

107

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
8
  • 4
    Did not work at first, had to run npm install after running npm rebuild node-sass before it worked for me Mar 7, 2021 at 15:17
  • 1
    Thanks! This worked for me in a Vue 2.x project that started throwing this error
    – James
    May 31, 2021 at 5:10
  • 1
    After use this command: npm i node-sass -D It works for me as charm Jun 17, 2021 at 16:16
  • I uninstalled node-sass and didn't realize it was a dependency on packagr for Angular project (old style of build - upgrading...but need old for testing) Nov 10, 2021 at 14:09
  • Thanks Google!! Dec 2, 2021 at 21:54
72

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

3
  • 9
    Odd I needed to add sass after adding sass-loader (using yarn and Vue 2.x), but that fixed it for me.
    – Glen Mazza
    Jan 22, 2021 at 11:05
  • 3
    Sometimes I think what if there were no developer community. How could we poor devs would know that we have to manually add sass too :'D
    – Vinay
    Oct 17, 2021 at 12:40
  • 2
    The actual command I had to use was: npm install sass-loader sass webpack --save-dev Taken from https://webpack.js.org/loaders/sass-loader/ Feb 21, 2022 at 16:33
21

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: [],
1
  • 4
    I had the same problem as a I upgraded from Angular 12.0.x to 12.4.x. The solution was to remove the styles: [``]
    – LaurentG
    Sep 30, 2021 at 8:59
7

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.

3

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

npm i node-sass -D
2

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.

0

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.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.