Next.js: Experimental React refresh breaks custom scss configuration

[stefvhuynh]

Bug report

Describe the bug

I was working on version 9.3.5 and using next-sass to compile .scss files. Switching to version 9.3.6 and turning on react refresh results in the following error:

components/common/common.scss:1
ReferenceError: self is not defined

Due to internal constraints, I cannot use the [name].module.scss method of using sass.

To Reproduce

1. Use next version 9.3.6
2. Apply next-sass in next.config.js
3. Set reactRefresh: true
4. Import an .scss file in the index page
5. Run the app locally with next
6. See the above compilation error

Expected behavior

The .scss files should compile normally.

System information

• OS: macOS
• Version of Next.js: 9.3.6
• Version of Node.js: 12.16.1

[Cloudo]

I had the same problem with .css files

[ error ] ./node_modules/normalize.css/normalize.css
ReferenceError: self is not defined

because i used @zeit/next-css
Switching to built-in CSS support and fixing all warnings (moving global CSS imports to pages/_app.tsx) fixed this.