React还没切换到对应路由但是引入的css，ts就加载了？

Question

比如我有两个页面
/a
/b
我在a页面的时候b页面里的css，ts就已经加载了，请问怎么能访问当前页面得时候再加载当前页面的资源呢？

// b.tsx 还没切换到这个页面呢，里面的./index.less，@/utils/socketio等就执行了

import './index.less'
import React from 'react'
import socket from '@/utils/socketio'
const RightPannel = React.lazy(() => import('./components/RightPannel'))
const MonacoEditor = React.lazy(() => import('./components/MonacoEditor'))
import ReactContext from '@/utils/useContext'


const OnlineScreen = () => {
  return (
    <div className='vh100'>
      <header>
      </header>
      <div className="wrapper-flex">
        <React.Suspense fallback={<p>loading...</p>}>
          <ReactContext.Provider value={{socket}}>
            <div className="content">
                <MonacoEditor />
              </div>
              <div className="sidebar">
                <RightPannel />
              </div>
          </ReactContext.Provider>
        </React.Suspense>
      </div>
    </div>
  )
}

export default OnlineScreen