Topic: issue using the package on next js

AmineMazars priority asked 10 months ago


*_Expected behavior_*when install the package i can use it normal in next js

*_Actual behavior_*i installed the package in next js "^13.4.19" and i got this error :

./node_modules/react-perfect-scrollbar/dist/css/styles.cssGlobal CSS cannot be imported from within node_modules.Read more: https://nextjs.org/docs/messages/css-npmLocation: node_modules\mdb-react-ui-kit\dist\mdb-react-ui-kit.esm.js

Import trace for requested module:./node_modules/react-perfect-scrollbar/dist/css/styles.css./node_modules/mdb-react-ui-kit/dist/mdb-react-ui-kit.esm.js./pages/Home/index.js

Resources (screenshots, code snippets etc.)

import React, { useEffect } from 'react'; import { MDBCard , MDBButton} from 'mdb-react-ui-kit' import styles from './sample.module.css' const ExportredTitle = () => { console.log('---------loading remote component---------'); useEffect(() => { console.log('HOOKS WORKS'); }, []); return ( {' '} This came fom checkout !!! And it works like a charm v2

Button ); };

export default ExportredTitle;


Mateusz Lazaru staff answered 10 months ago


This issue shows up when you're working on nextjs old project type (without app router) and import styles from node_modules. You could copy the mdb-react-ui-kit from node_modules/ do the src/ directory, and it will disappear. We are currently working to fix it, so any additional steps will not be necessary.



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 7.0.0
  • Device: pc
  • Browser: chrome
  • OS: windows
  • Provided sample code: Yes
  • Provided link: Yes