1. MDB Home Page
  2. Support Main Page
  3. MDB React
Topic: MDB5 Version 1.4.0 - npm run build error

Alecta priority asked 3 years ago

Expected behavior

Should create a production build.

Actual behavior

VERSION 1.4.0

./node_modules/mdb-react-ui-kit/dist/css/mdb.min.css ParserError: Syntax Error at line: 1, column 26

npm ERR! code ELIFECYCLE npm ERR! errno 1

Resources (screenshots, code snippets etc.)

Hi,

Created vanilla CRA project.

Dependencies:

 "dependencies": {
"@testing-library/jest-dom": "^5.14.1",
"@testing-library/react": "^11.2.7",
"@testing-library/user-event": "^12.8.3",
"@types/jest": "^26.0.23",
"@types/node": "^12.20.15",
"@types/react": "^17.0.11",
"@types/react-dom": "^17.0.8",
"bootstrap": "^5.0.1",
"mdb-react-ui-kit": "git+https://oauth2:XXXXXXXXX@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",
"typescript": "^4.3.4",
"web-vitals": "^1.1.2"
}

App Component:

import React from "react";
import "mdb-react-ui-kit/dist/css/mdb.min.css";
import "./App.css";

function App() {
  return (
    <div className="App">
      <p>Hello World!</p>
    </div>
  );
}
export default App;

Has any changes occurred that is breaking between version 1.3.0 and 1.4.0?

How do we lock to specific version "1.3.0"?

Tried like this but it did not work:

npm install git+https://oauth2:XXXXXXX@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential.git#1.3.0

npm install git+https://oauth2:XXXXXXX@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential#1.3.0

Many thanks.

Wojciech Staniszewski staff answered 3 years ago

You could also try to clean npm cache after adding this:

    "resolutions": {
        "postcss-custom-properties": "^9.1.1"
    },

Next, reinstall the project. If it still does not work, you could install 1.3.0 as above.

Alecta priority answered 3 years ago

Hello,

Could you please provide answer for this?

This is blocking for us. We need to be able to lock to a specific version so this don't occur again, and for us to be able to test new versions.

How do we intall version 1.3.0 until you solve this issue?

Tried like this but it did not work:

npm install git+https://oauth2:XXXXXXX@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential.git#1.3.0

npm install git+https://oauth2:XXXXXXX@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential#1.3.0

Many thanks.

Zhou premium commented 3 years ago

npm install git+https://oauth2:XXXXXXX@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential#695ed9ec3df9df214e714567fa11678a0e6861f9

Jesse pro commented 3 years ago

I was also having the same issue with the same MDB dependency as the OP while deploying a MERN app to Heroku. Changing the "mdb-react-ui-kit" dependency in the client's package.json to the version provided by Zhou solved my issue. Thank you!

MarTechBH premium answered 3 years ago

Try this.

"resolutions": {
    "postcss-custom-properties": "^12.0.0"
  },
  "scripts": {
    "preinstall": "npx npm-force-resolutions",
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

Alecta priority answered 3 years ago

Hi,

Sorry but we don't understand where in package.json to put the above for it to work?

This did not work.

 {
      "name": "mdbpro",
      "version": "0.1.0",
      "private": true,
      "dependencies": {
        "@testing-library/jest-dom": "^5.14.1",
        "@testing-library/react": "^11.2.7",
        "@testing-library/user-event": "^12.8.3",
        "@types/jest": "^26.0.23",
        "@types/node": "^12.20.15",
        "@types/react": "^17.0.11",
        "@types/react-dom": "^17.0.8",
        "bootstrap": "^5.0.1",
        "mdb-react-ui-kit": "git+https://oauth2:XXXXXXX@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential/",
        "react": "^17.0.2",
        "react-dom": "^17.0.2",
        "react-scripts": "4.0.3",
        "typescript": "^4.3.4",
        "web-vitals": "^1.1.2"
      },
      "resolutions": {
        "postcss-custom-properties": "^9.1.1"
      },
      "scripts": {
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test": "react-scripts test",
        "eject": "react-scripts eject"
      },
      "eslintConfig": {
        "extends": [
          "react-app",
          "react-app/jest"
        ]
      },
      "browserslist": {
        "production": [
          ">0.2%",
          "not dead",
          "not op_mini all"
        ],
        "development": [
          "last 1 chrome version",
          "last 1 firefox version",
          "last 1 safari version"
        ]
      }
    }

How do we intall version 1.3.0 until you solve this issue?

Tried like this but it did not work:

npm install git+https://oauth2:XXXXXXX@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential.git#1.3.0

npm install git+https://oauth2:XXXXXXX@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential#1.3.0

Wojciech Staniszewski staff answered 3 years ago

Try to add this to package.json for now:

  "resolutions": {
    "postcss-custom-properties": "^9.1.1"
  },
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB React
  • MDB Version: MDB5 1.3.0
  • Device: PC
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes
Tags
mdbpro mdbreact build-fail
About author
Alecta
61Support score
5Questions 3Answers 0Snippets