Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Next.js Window is not defined

futuric.io priority asked 2 years ago


Hey there,
I'm using the MDB5 react ui kit in version 4.1.0 for my next.js/react.js project. The Problem is I can't even use a single container without the error message (window is not defined). I can load a component in next.js with dynamic and server side rendering as false... then I can use mdb components. But then I can never use useState/useEffect in a component only on the page and also a sourrounding layout arround components is not possible.

My app.js file:

import 'mdb-react-ui-kit/dist/css/mdb.min.css';
import '../styles/globals.css';
import { MDBContainer } from 'mdb-react-ui-kit';

function MyApp({ Component, pageProps }) {

    return (
        <MDBContainer>
            <Component {...pageProps} />    
        </MDBContainer>
    )


}


export default MyApp

The Error Message: enter image description here

package.js (the oauth token is off course deleted in this copy

{
      "name": "MyApplication",
      "version": "0.1.0",
      "private": true,
      "scripts": {
            "dev": "next dev",
            "build": "next build",
            "start": "next start"
      },
      "dependencies": {
            "cookies-next": "^2.0.4",
            "jquery": "^3.6.0",
            "mdb-react-ui-kit": "git+https://oauth2:DELETED@git.mdbootstrap.com/mdb/react/mdb5/prd/mdb5-react-ui-kit-pro-essential#4.1.0",
            "next": "^12.2.2",
            "react": "^18.1.0",
            "react-dom": "^18.1.0",
            "react-icons": "^4.2.0"
      }
}

Krzysztof Wilk staff commented 2 years ago

Hi!

We don't guarantee the proper working of our package with Next.js at this moment. The integration is planned for the near future.

Anyway - there's a workaround for that and I think the solution from this topic should be helpful. https://mdbootstrap.com/support/react/install-with-latest-next-js-referenceerror-window-is-not-defined/


futuric.io priority commented 2 years ago

Do you already know when the package for next.js is getting released? This year?


Krzysztof Wilk staff commented 2 years ago

Hi!

I'm afraid there's no ETA for that but for sure this will be released in one or two months.



Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Opened

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB React
  • MDB Version: MDB5 4.1.0
  • Device: PC
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: No