InversifyJS + TypeScript + 彈出的 CRA：使用接口導入文件的問題

Question

此處提供代碼： https://github.com/rtrocca/test-inversify-cra

我使用 CRA 和 TypeScript 模板創建了一個簡單的 React 應用程序並彈出了該應用程序。

然后我添加了 Ninja/Katana/Shuriken 示例的文件。

我還修改了 babel 和 typescript 配置：

tsconfig.json

"experimentalDecorators": true,
"emitDecoratorMetadata": true

並在 lib 部分添加了“es6”。

對於 Babel，更改位於 package.json 文件的 babel 部分：

"plugins": [
      "babel-plugin-transform-typescript-metadata",
      [
        "@babel/plugin-proposal-decorators",
        {
          "legacy": true
        }
      ],
      [
        "@babel/plugin-proposal-class-properties",
        {
          "loose": true
        }
      ]
    ]

然后我運行npm start並得到了一個“驚喜”：雖然 Babel 可以構建代碼並且它有效，但 tsc 生成以下錯誤：

Compiled with problems:

ERROR in ./src/di/entities.ts 25:108-114
export 'Weapon' (imported as 'Weapon') was not found in './interfaces' (module has no exports)

ERROR in ./src/di/entities.ts 25:142-148
export 'Weapon' (imported as 'Weapon') was not found in './interfaces' (module has no exports)

ERROR in ./src/di/entities.ts 25:157-172
export 'ThrowableWeapon' (imported as 'ThrowableWeapon') was not found in './interfaces' (module has no exports)

ERROR in ./src/di/entities.ts 25:200-215
export 'ThrowableWeapon' (imported as 'ThrowableWeapon') was not found in './interfaces' (module has no exports)

我找不到解決這個問題的方法。 有什么提示嗎？ 我沒有嘗試使用 craco & c。因為似乎所有這些工具都越來越少了。

謝謝。

Answer 1

最后我找到了問題所在。 這些警告類似於https://javascript.plainenglish.io/leveraging-type-only-imports-and-exports-with-typescript-3-8-5c1be8bd17fb中描述的內容。 換句話說，只包含類型定義的 TypeScript 文件被擦除，但導入仍然存在。 解決方案，因為 TypeScript 3.8 是使用import type