在我的angular项目中使用@types/cleave.js时，如何忽略TS1192？

Question

我在Angular 6应用程序中使用cleave.js (^1.5.2)和@types/cleave.js包(^1.4.0)时，发生了一件奇怪的事情。如果我运行ng build来构建应用程序，它会失败，并显示以下错误：

ERROR in src/app/app.component.ts(4,8): error TS1192: Module '"C:/Users/evcomes/Angular2/hellogular/node_modules/@types/cleave.js/index"' has no default export.
src/app/app.component.ts(5,8): error TS1192: Module '"C:/Users/evcomes/Angular2/hellogular/node_modules/@types/cleave.js/options/index"' has no default export.

我在@types/cleave.js的源代码中看到了这一点，但它只是一个类型库，为什么我需要缺省导出？真正奇怪的是，如果我修改了一个文件(并不重要)，然后保存，自动重新构建将拾取它(仍然显示错误，但仍在继续)，将很高兴地为正在开发的angular应用程序提供服务，并且我使用的cleave.js功能甚至可以在我的浏览器中工作。那么这不是一个真正的错误吗？我怎么才能把它关掉？

我见过的任何使用DefinitelyTyped库的教程或指南都只是说，npm安装它们应该足以在没有任何其他修改的情况下使用它们，所以我在搜索这个库时发现的大多数问题都是人们试图为JS库或他们自己的模块创建自己的TypeScript绑定。

在package.json中：

...
"@types/cleave.js": "^1.4.0",
"cleave.js": "^1.5.2"
...

在我的tsconfig.json中：

...
"esModuleInterop": true,
"typeRoots": [
   "node_modules/@types"
]
...

在我的app.component.ts中：

...
import Cleave from 'cleave.js';
import CleaveOptions from 'cleave.js/options'
...

Answer 1

大多数获取TS类型的js库都使用...* as...。或者需要tsconfig中的allowSyntheticDefaultImports: true才能使默认导出正常工作。

import * as CleaveOptions from 'cleave.js/options'
// AND
import Cleave from 'cleave.js'

//tsconfig.json
...
{
  allowSyntheticDefaultImports: true
}
...