如何在没有TypeScript定义的情况下导入npm包，以便IDE仍提供intellisense？

我使用的npm包没有TypeScript的类型定义。确切地说，我正在使用react-google-maps库。如何在没有TypeScript定义的情况下导入npm包，以便IDE仍提供intellisense？

按照他们的榜样，我进口下列组件从包：

error TS2305: Module '"react-google-maps"' has no exported member 'GoogleMapLoader'.

所以，我速战速决，这是一个：

import {GoogleMapLoader, GoogleMap, Marker} from "react-google-maps";

然而，打字稿编译期间抛出一个错误该模块的成员类型为“any”的声明：

declare module "react-google-maps" { 
    export var GoogleMapLoader:any; 
}

现在，pr但是，问题是我的IDE（WebStorm）不再提供智能感知。 GoogleMapLoader甚至不被认为是反应组分，如果我使用Babel，我相信它会被认可（至少没有类型的方法和性质）。

如何导入npm包，而不通过TypeScript编译器解析类型定义，但不妨碍IDE提供intellisense？

来源

2016-08-25 Carven

尝试使用'preferences' - >'languages＆frameworks' - >'JavaScript' - >'Libraries' - >'Add'，并将您的npm模块添加为库。 –

@SergeyPanfilov我已将node_modules中的react-google-map文件夹添加到您提到的位置，但我仍未收到该模块的智能感知。还有什么我可能错过了？ – Carven

@SergeyPanfilov你的建议与打字稿无关。编译器不会咨询WebStorm配置的库。 –

你需要声明你正在使用的是什么，而不是仅仅使用any。

例如：

declare module "react-google-maps" { 
    interface GoogleMapLoaderProps { 
     .... 
    } 

    interface GoogleMapLoaderState { 
     .... 
    } 

    class GoogleMapLoader extends React.Component<GoogleMapLoaderProps, GoogleMapLoaderState> { } 
}

您可以与您正在使用正是和需要的IDE支持开始，慢慢加东西。
您可以检查Writing Declaration Files获取更多关于如何操作的信息。

来源

2016-08-25 10:01:03

'react-google-map'不是我写的。这是我安装的一个npm软件包。所以，如果我想在我的IDE中使用这个软件包的intellisense，那么我将不得不为它写出整个定义文件？有没有办法，没有编写每个属性和方法定义，IDE仍然可以识别包中的类，方法和属性，而不需要像使用ES5/ES6那样的类型？ – Carven

不，不是真的。 IDE并不是真正的问题，因为IDE只是将编译器用作服务。您需要编译器了解发生了什么，然后IDE才会知道。定义文件不是（大多数情况下）由库的制造商提供，所以其他人（用户）编写'.d.ts'文件并更新不同的存储库（例如'DefinitelyTyped'）。你的选择是使用没有IDE支持的'any'或者自己编写一个。你不必为整个库写定义，只需要你需要的部分。 –

嗯......但是至少我没有基本的intellisense，如果我没有使用Typescript，我会得到什么？我的意思是，如果我已经使用了Babel或者普通的ES5，而没有任何定义文件，webstorm仍然会给我基本的intellisense，它基于封装中写入的任何类成员，函数/变量。但是对于“任何”Typescript定义，似乎我已经覆盖了对这些函数/变量的任何识别，并且我从IDE获得零支持？这就像是“写入定义”或“根本就没有智能感知”情景？ – Carven

如何在没有TypeScript定义的情况下导入npm包，以便IDE仍提供intellisense？

回答

相关问题