Running MDB React Pro

gtb asked 5 months ago


I'm a fairly new dev in the React space.

  1. I've downloaded the zip file and extracted the files onto a local folder.
  2. I've navigated to that folder and run Visual Studio Code to open the folder.
  3. I've run yarn init and yarn install and they both ran without an issue
  4. If I run yarn start I get the following error message. I've pasted in the relevant bit

yarn run v1.5.1
$ yarn run sass-compile && concurrently --kill-others "yarn run sass-compile --watch" "yarn run webpack"
$ node-sass dist/scss -o dist/css
"status": 1,
"file": "E:/development/MDB-React-Pro/MDB React Pro/dist/scss/core/_mixins.scss",
"line": 215,
"column": 15,
"message": "Functions may not be defined within control directives or other mixins.",
"formatted": "Error: Functions may not be defined within control directives or other mixins.n on line 215 of dist/scss/core/_mixins.scssn>> @function set-notification-text-color($color) {nn --------------^n"


Is there something else that needs to be run so I can the examples?

And having done all of that and got a separate project running with the MDB React pro download, at which point I assume I can see all the code as examples(?), it's still not clear to me what I need to import them into my existing react application. I'm using MDB react (basic version) in that, albeit with some css issues. There obviously isn't an install command for the Pro code.

Thanks for your time.


gtb commented 5 months ago

I've tried the proposed solution of uninstalling and reinstalling an earlier version of node-sass but this now fails during the reinstall because it can't find python despite this being installed in its default location on a windows 10 PC. Python definitely added a couple of entries to the PATH.

Anyway, the reinstall starts off with:

> node-sass@3.13.1 install E:developmentMDB-React-ProMDB React Pronode_modulesnode-sass
> node scripts/install.js

Downloading binary from
Cannot download "":

HTTP error 404 Not Found

and it obviously continues to error from there.

I'm still confused why I need to be running the whole Pro download as its own application anyway. Is it meant to be some type of boilerplate project? Do you have some simple instructions for adding components to an existing React project?

gtb commented 5 months ago

Went through the install from scratch, downloading the zip file again (still the same version number), running the basic yarn commands to get the application working and still get exactly the same error.

twentyfour commented 5 months ago

I'm having exactly the same issue on Mac osX. Any progress on this?

Hi there all.

There was a mistake in scss folder, which was causing mentioned error. It is now fixed and if You download the latest version of MDB React there is no problem with that.

If You want to manually fix that issue, You can move that function:

@function set-notification-text-color($color) {
@if (lightness($color) > 70) {
@return $black; // Lighter backgorund, return dark color
} @else {
@return $white; // Darker background, return light color
outside the @mixin.

Mikołaj Smoleński commented 5 months ago

This code is placed in dist/scss/core/_mixins.scss file

twentyfour commented 5 months ago

Thank you very much Mikolaj !

Wington R. Brito commented 4 months ago

Thanks for posting the solution! Btw, the latest version of MDB has not been updated yet. I just got the latest and ran into this same error.

Mikołaj Smoleński commented 4 months ago

Yes, the code is fixed only in the version we are currently working on. It will be released next week. Regards

twentyfour answered 5 months ago

I'm having exactly the same problem. Was anyone able to resolve this?




twentyfour commented 5 months ago

Found this: and it helped. It's running now on my Mac osX but not the pro-version ;-) Any ideas on how to run the pro-version using npm or yarn?

Please insert min. 20 characters.

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: React
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No