Mingyu Jeon
Mingyu Jeon

Reputation: 1783

SASS partial import doesn't work in react

I practice SASS coding invention now. I made react app using npx create-react-app.

My structure is like below.

src
├── test
│   ├── _index.scss
│   utils
│   ├── _index.scss
│   └── _mixins.scss
│
├── main.scss
...

And I imported scss files in main.scss.

@import "components";
@import "utils";

However, it causes error, and I have no idea what I did wrong.

Failed to compile.

./src/styles/main.scss (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./src/styles/main.scss)
Module not found: Can't resolve './components' in '~/src/styles'

Upvotes: 2

Views: 1321

Answers (1)

Tony
Tony

Reputation: 20132

Your code should be

@import "./utils/_index";
@import "./utils/_mixins";

You have to specify the relative path to the scss file or else your code will not work

Upvotes: 1

Related Questions