Это надо мануально делать.

То есть самому реализовывать систему роутов, а не использовать "react-router-dom" ?

Можно и с ним.

Но загрузку самому

Если самому реализовывать, то

В lazyLoad.js :

export default function Lazy({ component, initialFallback = <></> }){

  const fallback = useRef(() => initialFallback);
  const Component = component;

  const updateFallback = async () => {
    const result = await component._result;
    fallback.current = typeof result === 'function' ? result : result?.default;
  }

  useEffect(() => {
    updateFallback();
  }, [component]);

  let loadingProcess = ()=>{
    return fallback?.current?.name ? <><TopBarProgress/><fallback.current/></> : <Loading type="fullPage"/>;
  }

  return (
    <Suspense fallback={loadingProcess()}>
      <Component />
    </Suspense>
  );
};

А в app.js так :

import Lazy from './LazyLoad';
...
<Switch>
  <Route exact path="/">
    <Lazy component={...}/>
  </Route>
  ...
</Switch>

В функции loadingProcess он ссылается на текущий компонент и заново его перерисовывает, можно как - то от это избавиться ? memo и useCallback помогут?

Нужно хранить текущий компонент в useState

Всем привет. Вопрос по CSS Modules. Можно ли добраться из родительского компонента, до какого-ниюудь div с классом в дочернем компоненте (грубо говоря каскад стилей). В интернете искал ничего не нашел.

Пока я могу добраться только с помощью тега, но не по имени класса

Одна из фундаментальных вещей CSS: селектить только можешь сверху вниз, заселектить родителей нельзя

Поэтому придется как-нибудь хитрить либо с именами классов, либо ещё как-нибудь

+

Есть только :focus-within, Но это исключение

Это я понимаю, вопрос был по CSS Modules, где классы хэшируются))

НО все равно спасибо))

Буду знать, спасибо)

Css modules про другое

Он ничего не добавляет в спеку

Только коллбэк навешать если можно такое реализовать

А тут тебе тоже ничем не поможет, можешь только поиграться с названиями

Спасибо