Using SCSS files in create-react-app project

web
mobile

Topic: Using SCSS files in create-react-app project

cokicoki pro premium asked 3 months ago

Hi,

I am following a 5 min Quick Start to setup a custom-variables.scss, but I could not find mdb.scss file. There are only two files available at the node_modules/mdbreact/dist directory below: -mdb-free.scss -mdb-pro.scss

So when I typed npm start at the terminal to run my project, I got an error message that the module could not be found.

Would you kindly advise what went wrong?

Thank you very much.


Jakub Chmura staff premium answered 3 months ago

Hi, @cokicoki

Can you check this topic? I think is related to this post.

https://mdbootstrap.com/support/react/error-after-following-steps-in-scss-portion-of-5-min-quick-start/

Let me know if it helps you.

Thanks.

Best, Kuba


cokicoki pro premium commented 3 months ago

Thanks so much Kuba.


cokicoki pro premium answered 3 months ago

Hi Kuba,

I think you refer the wrong solution. I have read and it is not the answer.

This file is not available mdb.scss so it caused the render error.

Please check again this link sir!

https://mdbootstrap.com/docs/react/getting-started/quick-start/

import our main scss file:
index.js

import "./assets/scss/mdb.scss"

Thank you Kuba.


Piotr Glejzer staff answered 3 months ago

Hi,

I change the description of importing SCSS in CRA with mdbreact. I tested it and it is working.

Take a look now https://mdbootstrap.com/docs/react/getting-started/quick-start/

Have a nice day.


cokicoki pro premium commented 3 months ago

Thanks so much Piotr Glejzer for your solution.


Jakub Chmura staff premium commented 3 months ago

Your welcome,

If there is anything else I could do for you do not hesitate to ask us.

Best, Kuba


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: React
  • MDB Version: 4.24.0
  • Device: PC
  • Browser: Mozilla Firefox
  • OS: MS Windows 7
  • Provided sample code: No
  • Provided link: No