Vue2 - Error: PostCSS received undefined instead of CSS string

user_5550833 0
Viewed 12053

i have this problem when trying to compile a Vue2 project

Syntax Error: Error: PostCSS received undefined instead of CSS string
 @ ./src/assets/sass/main.scss 4:14-233 14:3-18:5 15:22-241
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://192.168.1.202:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

I have tried to rebuild the sass-loader with no success.

My node version is v16.6.1 My NPM version is 7.21.0

Webpack is 5.1.2 and the sass-loader version is 10.2.0

This is a VUE2 project and all started when i started a new Vue3 project and i had to upgrade the vue/cli but i cannot understand how to go back locally (if this is the problem)

sass-loader vuejs2 node.js
7 Answers

Try it

npm install node-sass
or 
npm rebuild node-sass

I got answer for here

user_86270790

Solved by first uninstalling node-sass:

yarn remove node-sass

And then installing sass instead:

yarn add -D sass

user_41852970

I also faced the same error and after downgrading the node version it was fixed.

user_94620630

I resolved this issue by downgrading my version of "node-sass" to "^4.14.1":

npm install node-sass@4.14.1
user_1206030

solved by switching to node v15.14.0

user_106987410

enter image description here

Hey, I was following a tutorial about VueJS, and I had the same error, tried to rebuild node-sass it didn't work.

Then I saw that the lang used in the style balise was SCSS (in the App.vue) , I changed it to CSS and it worked. :)

user_176820570

This error, Error: PostCSS received undefined instead of CSS string is being thrown by sass-loader.

One solution would be to reinstall sass-loader. By using the following steps, the sass compile error should be fixed.

Steps for npm & yarn

! Note: If you have node-sass installed, you will need to reinstall it as well, by using the following commands:

# npm
npm uninstall sass-loader node-sass
npm install sass-loader node-sass --save-dev

# yarn
yarn remove sass-loader node-sass
yarn add sass-loader node-sass --dev

To reinstall sass-loader run these commands:

# npm
npm uninstall sass-loader
npm install sass-loader --save-dev

# yarn
yarn remove sass-loader
yarn add sass-loader --dev
user_60941940
Related