Topic: React Server Side Rendering Errors
                                            
                                            datashield
                                                                        asked 7 years ago                                
Hi,
I am using MDB React Pro v4.8.7. My team uses SSR for all of our websites but I have been getting errors trying to use MDB. I have looked around before posting and found a GitHub issue (here / here) indicating that MDB was not SSR compatible as of October 28, 2018.
The exact error I'm receiving is:
ReferenceError: window is not defined
at Object.<anonymous> (\development\learning\mdb-experiment\node_modules\mdbreact\dist\mdbreact.js:1:1660)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object.mdbreact (\development\learning\mdb-experiment\dist\server\static\development\pages\index.js:522:18)
at __webpack_require__ (\development\learning\mdb-experiment\dist\server\static\development\pages\index.js:23:31)
at Module../components/sidenav/index.jsx (\development\learning\mdb-experiment\dist\server\static\development\pages\index.js:107:66)
at __webpack_require__ (\development\learning\mdb-experiment\dist\server\static\development\pages\index.js:23:31)
at Module../pages/index.jsx (\development\learning\mdb-experiment\dist\server\static\development\pages\index.js:435:77)
at __webpack_require__ (\development\learning\mdb-experiment\dist\server\static\development\pages\index.js:23:31)
at Object.3 (\development\learning\mdb-experiment\dist\server\static\development\pages\index.js:510:18)
at __webpack_require__ (\development\learning\mdb-experiment\dist\server\static\development\pages\index.js:23:31)
I was wondering if there is an update (or beta releases) that resolves the issues with window references described in the GitHub issue. If there is not, are there any known workarounds or other information on the matter?
Thanks
                                                    
                                                    Jakub Mandra
                                             staff  premium                                             answered 7 years ago                                        
Hi,
There are components in the package which are dependent of window object. So you would have to define window on the server side.
There are no updates yet which would clearly resolve that issue.
                                                    
                                                    datashield
                                                                                        answered 7 years ago                                        
Hello,
Thanks Jakub for the information. Is there any plans or timeline for this feature currently?
                                                    
                                                    Jakub Mandra
                                             staff  premium                                             answered 7 years ago                                        
We have plans for rollup implementation. First tests will have place in two weeks from now. But we can't estimate any release time.
Best
                                                    
                                                    công võ
                                                                                        answered 7 years ago                                        
Hi @Jakub Mandra, I waiting for you about MDB to suport SSR. I'm using 4.14 ver, but still get this error
                                                    
                                                    Jakub Mandra
                                             staff  premium                                             answered 7 years ago                                        
Hi @công võ
SSR support has been added with version 4.10.0
Have you updated your mdbreact package properly? 
Try npm view mdbreact version
I recommend using npm to update packages because yarn sometimes mixes versions from a cache.
Also, here are our tutorials about Gatsby and Next.js usage with mdbreact:
https://mdbootstrap.com/articles/react/gatsby-mdb-react-quick-start-quide/
https://mdbootstrap.com/articles/react/materialize-your-next-js-project-with-mdbootstrap-for-react/
Best,
Jakub
Jakub Mandra staff premium commented 7 years ago
Ouh there was a bug in 4.14.0 with prop types.
But it is resolved in current v.4.15.0
you can read more about the issue here: https://mdbootstrap.com/support/react/update-to-4-14-breaks-website/
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB React
- MDB Version: 4.8.4
- Device: PC
- Browser: Google Chrome 71.0.3578.98
- OS: Windows 10
- Provided sample code: Yes
- Provided link: Yes