feat(config): optimize dependency management and enhance isomorphic layout effect hook
- Added a comprehensive list of dependencies to optimize for faster development builds in vite.config.ts. - Improved the useIsomorphicLayoutEffect hook with additional safety checks to ensure React hooks are available in both client and server environments.
This commit is contained in:
@@ -1,6 +1,25 @@
|
||||
import { useLayoutEffect, useEffect } from 'react';
|
||||
|
||||
// Use useLayoutEffect in browser environments and useEffect in SSR environments
|
||||
const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
|
||||
// with additional safety checks to ensure React hooks are available
|
||||
const useIsomorphicLayoutEffect = (() => {
|
||||
// Check if we're in a browser environment
|
||||
if (typeof window === 'undefined') {
|
||||
// Server-side: return useEffect (which won't execute anyway)
|
||||
return useEffect;
|
||||
}
|
||||
|
||||
// Client-side: ensure React hooks are available
|
||||
try {
|
||||
if (useLayoutEffect && typeof useLayoutEffect === 'function') {
|
||||
return useLayoutEffect;
|
||||
}
|
||||
} catch (error) {
|
||||
console.warn('useLayoutEffect not available, falling back to useEffect:', error);
|
||||
}
|
||||
|
||||
// Fallback to useEffect if useLayoutEffect is not available
|
||||
return useEffect;
|
||||
})();
|
||||
|
||||
export default useIsomorphicLayoutEffect;
|
||||
Reference in New Issue
Block a user