Dynamic import する Component に 型をつける

import dynamic from 'next/dynamic';
import type Item from '@library/item';

const Component = dynamic(
  () => {
    return import('@library/item')
  },
  { ssr: false }
) as typeof Item

• Type-Only Imports and Export：明示的に型のみ import / export ができる

• 純粋に型のみが import / export されるので副作用などが発生しない

Documentation - TypeScript 3.8

TypeScript 3.8 Release Notes

https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-8.html

モジュール - 仕事ですぐに使えるTypeScript ドキュメント

以前のJavaScriptは、公式には複数のファイルに分割してコーディングする方法を提供していませんでした。 当初はClosure Compilerや、その他のYahoo! UIやjQueryなどのライブラリごとの固有のファイル結合ツール、require.jsなどを使っていました。 ...

https://future-architect.github.io/typescript-guide/module.html#import-export

Motivation

Before

After