fix: 修复joyride打包后不显示的问题

src/App.tsx

@@ -7,7 +7,6 @@ import { AppRoutes } from './routes/AppRoutes'
 import { AuthProvider } from './auth/AuthContext'
 import { AuthProvider } from './auth/AuthContext'
 import ToastWrapper from './components/ToastWrapper/ToastWrapper'
 import ToastWrapper from './components/ToastWrapper/ToastWrapper'
 import { store } from './store'
 import { store } from './store'
-import JoyrideStep from './components/JoyrideStep'
 
 
 const App: React.FC = () => {
 const App: React.FC = () => {
   return (
   return (
@@ -16,7 +15,6 @@ const App: React.FC = () => {
         <AuthProvider>
         <AuthProvider>
           <Router basename="/sdream-ai">
           <Router basename="/sdream-ai">
             <MainLayout>
             <MainLayout>
-              <JoyrideStep />
               <AppRoutes />
               <AppRoutes />
             </MainLayout>
             </MainLayout>
           </Router>
           </Router>

src/components/JoyrideStep/index.tsx

@@ -7,7 +7,7 @@ export default function JoyrideStep() {
   const [run] = useState(isMobile() && !joyrideLocal)
   const [run] = useState(isMobile() && !joyrideLocal)
   const steps = [
   const steps = [
     {
     {
-      target: '.layoutNavBarAgent',
+      target: '.layoutNavBarJoyride',
       content: '点击logo 解锁更多功能 🎉',
       content: '点击logo 解锁更多功能 🎉',
     },
     },
   ]
   ]

src/layouts/Navbar/Navbar.tsx

@@ -13,6 +13,7 @@ import { NAV_BAR_ITEMS } from '@/config/nav'
 import { useAppDispatch, useAppSelector } from '@/store/hook'
 import { useAppDispatch, useAppSelector } from '@/store/hook'
 import Logo from '@/assets/svg/logo.svg?react'
 import Logo from '@/assets/svg/logo.svg?react'
 import { isMobile } from '@/utils'
 import { isMobile } from '@/utils'
+import JoyrideStep from '@/components/JoyrideStep'
 
 
 interface NavbarProps {
 interface NavbarProps {
   isHistoryVisible: boolean
   isHistoryVisible: boolean
@@ -85,19 +86,23 @@ const NavbarBase: React.FC<NavbarProps & WithAuthProps> = ({ isHistoryVisible, c
   }, navRef)
   }, navRef)
 
 
   return (
   return (
-    <motion.nav ref={navRef} className="h-full flex-shrink-0 flex flex-col items-center justify-center">
-      {/* hidden */}
-      <motion.div className={`${styles.layoutNavBarAgent}  rounded-full ${isH5NavVisible ? 'h-[55px] bg-white/40' : 'h-[380px]'} w-[54px] overflow-hidden py-[8px] sm:w-[64px] sm:bg-white gap-[24px] sm:h-auto sm:rounded-3xl sm:flex sm:py-[24px] sm:px-[8px]`}>
-        <NavBarItem isHistoryVisible={isHistoryVisible} onClick={handleClick} icon={Logo} label="" key="logo" type={isMobile() ? 'logo3' : 'logo'} />
-
-        {NAV_BAR_ITEMS.map((item) => {
-          return (
-            <NavBarItem isHistoryVisible={isHistoryVisible} onClick={handleClick} icon={item.icon} label={item.label} key={item.key} type={item.key} />
-          )
-        })}
-        <User onLogout={handleLogout} />
-      </motion.div>
-    </motion.nav>
+    <>
+      <motion.nav ref={navRef} className="h-full flex-shrink-0 flex flex-col items-center justify-center">
+        {/* hidden */}
+        <motion.div className={`layoutNavBarJoyride ${styles.layoutNavBarAgent}  rounded-full ${isH5NavVisible ? 'h-[55px] bg-white/40' : 'h-[380px]'} w-[54px] overflow-hidden py-[8px] sm:w-[64px] sm:bg-white gap-[24px] sm:h-auto sm:rounded-3xl sm:flex sm:py-[24px] sm:px-[8px]`}>
+          <NavBarItem isHistoryVisible={isHistoryVisible} onClick={handleClick} icon={Logo} label="" key="logo" type={isMobile() ? 'logo3' : 'logo'} />
+
+          {NAV_BAR_ITEMS.map((item) => {
+            return (
+              <NavBarItem isHistoryVisible={isHistoryVisible} onClick={handleClick} icon={item.icon} label={item.label} key={item.key} type={item.key} />
+            )
+          })}
+          <User onLogout={handleLogout} />
+        </motion.div>
+      </motion.nav>
+      <JoyrideStep />
+    </>
+
   )
   )
 }
 }