I am working on a Next project now (only UI design )and I was provided with a .env.local file which contains the envt variables to access authorized pages. But even after adding it to the root directory of the project, I am still directed to the login page and react also complains of Hydration eorr which I find to be extremely strange. Do you have any advice on how to resolve this because if not there is no way to gain any progress T__T
The.env.local file is a list of the MongoDB envt variables. Error: Text content does not match server-rendered HTML.
See more info here: https://nextjs.org/docs/messages/react-hydration-error
Call Stack
checkForUnmatchedText
node_modules\react-dom\cjs\react-dom.development.js (9647:0)
didNotMatchHydratedTextInstance
node_modules\react-dom\cjs\react-dom.development.js (11394:0)
prepareToHydrateHostTextInstance
node_modules\react-dom\cjs\react-dom.development.js (12606:0)
completeWork
node_modules\react-dom\cjs\react-dom.development.js (22232:0)
completeUnitOfWork
node_modules\react-dom\cjs\react-dom.development.js (26596:0)
performUnitOfWork
node_modules\react-dom\cjs\react-dom.development.js (26568:0)
workLoopSync
node_modules\react-dom\cjs\react-dom.development.js (26466:0)
renderRootSync
node_modules\react-dom\cjs\react-dom.development.js (26434:0)
performConcurrentWorkOnRoot
node_modules\react-dom\cjs\react-dom.development.js (25738:0)
workLoop
node_modules\scheduler\cjs\scheduler.development.js (266:0)
flushWork
node_modules\scheduler\cjs\scheduler.development.js (239:0)
MessagePort.performWorkUntilDeadline
node_modules\scheduler\cjs\scheduler.development.js (533:0)
after adding the .env.local file at the root
I have checked the .gitignore file as well and .env.local is inside. Is there a way to access the protected page so I can quickly start the UI design already.