DEV Community

Discussion on: The simple way to use Scoped and Global SCSS in Next.js

Collapse
 
f2aldi profile image
Aldi

Hello, i got error when add this to next.config.js
Said this :
TypeError: Cannot read property 'toString' of undefined
at /Applications/XAMPP/xamppfiles/htdocs/esteh/academy-landing/next.config.js:9:21

Why is there are error?

thanks

Collapse
 
vladymyrpylypchatin profile image
VladymyrPylypchatin

This happens after the next.js update. I recommend using the package @webdeb/next-styles. It makes using scoped *.scss files as simple as in CRA.

The example of the next.config.js using this package:

// next.config.js
const withStyles = require('@webdeb/next-styles')

module.exports = withStyles({
  sass: true, // use .scss files
  modules: true, // style.(m|module).css & style.(m|module).scss for module files
})

I hope this will help you :)

Collapse
 
chukwu3meka profile image
Chukwuemeka Maduekwe

do i still need to run this command
"npm install --save @zeit/next-sass node-sass"
after installing this package

Thread Thread
 
estebanrao profile image
Esteban Rao • Edited

According to nextjs.org/docs/basic-features/bui... you just need to run npm install sass / yarn add sass / pnpm add sass

Thread Thread
 
chukwu3meka profile image
Chukwuemeka Maduekwe

thanks