Topic: Trying to do basic MDBBtn import fails
Expected Behavior I expected that I would be able to import a MDBtn into app.tsx.
Actual behavior Multiple errors: 1) Attempted import error: 'MDBBtn' is not exported from 'mdb-react-ui-kit' (imported as 'MDBBtn'). 2) node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js (1484:8) @ attemptResolveElement. 3) Error: Unsupported Server Component type: undefined
Resources (screenshots, code snippets etc.)
import { MDBBtn } from 'mdb-react-ui-kit';
export default function Home() {
return (
<>
<MDBBtn>Button</MDBBtn>
</>
)
}
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Answered
Specification of the issue
- User: Free
- Premium support: No
- Technology: MDB React
- MDB Version: MDB5 6.1.0
- Device: MacBook Pro 2021
- Browser: Google Chrome
- OS: macOS Ventura 13.4
- Provided sample code: No
- Provided link: No
Related topics
Grzegorz Bujański staff commented a year ago
I created a new project and everything seems to be working fine. How did you add the MDB to the project? By npm?
Johnson Elugbadebo commented a year ago
Hi Gregorz, I'm having a similar issue. All my MDB components are triggering the "Attempted Import Error". I installed via NPM. I imported the CSS style sheets in the RootLayout "layout.js" file for my app.
I'm using the following dependencies: "mdb-react-ui-kit": "^6.1.0" "next": "^13.4.12" "react": "18.2.0" "react-dom": "18.2.0"
Any idea what is going on?
mlazaru staff commented a year ago
does import from
mdb-react-ui-kit.esmwork?Johnson Elugbadebo commented a year ago
Hi mlazaru -- this is working!!!!!!
I had to go with 'mdb-react-ui-kit/dist/mdb-react-ui-kit.esm.js' for the errors to stop.
Thank you very much!!!!
Johnson