how to include sass file in reactjs

reactjs sass node-sass scss-lint
NAVEED picture NAVEED · Sep 19, 2018 · Viewed 23.6k times · Source

I use browserify to transform my code now getting error while the sass files were getting imported

@import parse error

Can any one help me to sort this issue how to use and integrate

Answer

Karim picture Karim · Jan 12, 2019

With the latest version of create-react-app you don't have to eject your react app to add sass support.

Just add node-sass to your project:

NPM: npm install node-sass --save

YARN yarn add node-sass

And now you can import sass files in your react components. Check the official documentation here

Related questions

How to use SCSS variables into my React components

I am working on a React project that follows this structure src | components | Footer | index.jsx styles.scss Header | index.jsx styles.scss scss | helpers.scss variables.scss ... main.scss Into my variables file I was using the css custom …

Read More
Module not found: Can't resolve 'style'

I am trying to configure css modules using sass. I have followed some tutorials but none seem to work. The webpack config was mostly created by create-react-scripts. I seemed to getting this error "Module not found: Can't resolve 'style'" Any …

Read More
target first-child css styled-components

I am using styled-components and want to target the first child of Text, but am unable to do so. const Text = styled.p` font-size: 12px; &:first-child { margin-bottom: 20px; } `; ... component return( <div> <p>I am just …

Read More