We recently locked to node version 14.19.1 to maintain a stable version across environments. But after this, The below functionality is not working without deleting the lock file and rebuilding it.
Router.replace is not working without dropping the lock file and generating a new one.
import { useEffect } from 'react'
import { useRouter } from 'next/router'
export const useIfUnsavedChanges = (unsavedChanges, callback) => {
const Router = useRouter()
useEffect(() => {
if (unsavedChanges) {
const routeChangeStart = (url) => {
if (Router.asPath !== url ) {
const confirm = callback()
sessionStorage.setItem('nextRoute',url)
if (!confirm) {
Router.events.emit('routeChangeError')
Router.replace(Router, Router.asPath, { shallow: true })
throw 'Abort route change. Please ignore this error.'
}
}
}
Router.events.on('routeChangeStart', routeChangeStart)
return () => {
Router.events.off('routeChangeStart', routeChangeStart)
}
}
}, [unsavedChanges])
}
--------- package-lock.json------------------------------------------------------------
Sharing the CodeSandbox link for the lock file. I have been stuck for more than a week to identify the issue. I have line by line compared the lock file and tried to update the version in lock file to test but still no luck.
https://codesandbox.io/s/nice-raman-6mjx68?file=/package-lock.json
