import { StrictMode, useEffect } from 'react'
import { createRoot } from 'react-dom/client'
import { RouterProvider } from 'react-router-dom'
import { ConfigProvider } from 'antd-mobile'
import zhCN from 'antd-mobile/es/locales/zh-CN'
import 'antd-mobile/es/global'
// 导入必要的组件样式
import 'antd-mobile/es/components/popup/popup.css'
import 'antd-mobile/es/components/mask/mask.css'
import 'antd-mobile/es/components/date-picker/date-picker.css'
import 'antd-mobile/es/components/dialog/dialog.css'
import router from './router'
import { initRem } from './utils/rem'
import './i18n'
import './index.css'

// 初始化 rem 适配
initRem()

function App() {
  useEffect(() => {
    // 确保在 DOM 加载后再次设置
    initRem()
  }, [])

  return <RouterProvider router={router} />
}

createRoot(document.getElementById('root')!).render(
  <StrictMode>
    <ConfigProvider locale={zhCN}>
      <App />
    </ConfigProvider>
  </StrictMode>
)