React - 悬念未完全加载scss

Question

我做了以下实现：

import {lazy, Suspense} from 'react'

1. 加载（惰性）我的组件：

   const Component = lazy(() => import('./componentPath'))

2. 将 Switch 包装在 Suspense 中：

   <Suspense fallback={<span>Loading...</span>}>
       <Switch>
           <Route exact path='/path' component={Component} //>
       </Switch>
   </Suspense>
   

我遇到了以下问题：

在很多地方 css 都有不好的边距，即使有一些样式缺失。

我的目标是延迟加载路由级别的组件。

有什么办法可以解决这个问题吗？提前谢谢你。

组件结构：

在路由器级别延迟加载的主要组件：

import React from 'react';
import FirstSubComp;

import './style.scss'

const MainComp = () => (

    return (
      <FIrstSubComp/>
   )
);

第一个子组合：

import React from 'react'
import './style.scss'

const FIrstSubComp = () => (

    return (
      <div>First sub comp<div>
   )
);

Answer 1

对于遇到此问题的任何人，请确保每个组件都导入其 .css 文件。

我有一些组件依赖于其他组件（不是父组件）的 .css 文件，导致了这个问题。