динамически импортируемый css файл не задерживается при использовании машинописи

Question

У меня есть этот код в компоненте реакции:

export const Dashboard: React.FC = () => {
  useEffect(() => {
    (async () => {
      await import('./Dashboard.css');
      console.log('foo');
    })();
  }, []);

Я бы подумал, что этот файл css не будет загружен, пока блок кода не будет запущен, но таблица стилей будет загружена при запуске приложения .

Мой tsconfig.json файл выглядит так:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "jsx": "react",
    "outDir": "./dist",
    "baseUrl": ".",
    "esModuleInterop": true
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx"
  ],
  "exclude": [
    "../../node_modules",
    "build",
    "src/**/*.test.ts",
    "src/**/*.test.tsx"
  ]
}

Answer 1

В вашем tsconfig установите модуль в "esnext". Важно разрешить динамическую загрузку c.