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:
chamiakJ
2025-06-03 10:55:37 +05:30
parent 593e6cfa98
commit e8bf84ef3a
2 changed files with 45 additions and 1 deletions

View File

@@ -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;

View File

@@ -28,6 +28,31 @@ export default defineConfig(({ command }) => {
],
},
// **Optimize Dependencies**
optimizeDeps: {
include: [
'react',
'react-dom',
'react/jsx-runtime',
'react/jsx-dev-runtime',
'antd',
'@dnd-kit/core',
'@dnd-kit/sortable',
'@dnd-kit/modifiers',
'@dnd-kit/utilities',
'react-redux',
'@reduxjs/toolkit',
'i18next',
'react-i18next',
'react-router-dom',
'moment',
'date-fns',
'axios',
'socket.io-client'
],
force: true, // Force re-optimization on every dev server start
},
// **Build**
build: {
// **Target**