我正在尝试使用TypeScript和一些外部库设置WebPack,但遇到了一些麻烦。
我正在导入jQuery的src版本,以便让WebPack选择所需的模块(这是使Boostrap-SASS加载器工作所需的),所以我在TS中导入这样的库:
import jquery = require( 'jquery/src/jquery.js' );
编译时会抛出错误cannot find external module 'jquery/src/jquery'
。如果我创建一个手动.d.ts文件来定义库,如下所示:
declare module "jquery/src/jquery"{}
然后编译器工作,但警告:
cannot invoke an expression whose type lacks a call signature
或者,如果我将导入行更改为
var jquery = require( 'jquery/src/jquery' );
(我认为是CommonJS样式导入?)然后它编译(并运行)很好。所以,问题:
var
代替import
,或者只是在它工作的时候使用它?我只是选择了WebPack,所以我完全有可能做一些愚蠢的事情。如果有的话请纠正我!
修改
当我在思考如何解释这个问题时,我想到了这个问题:
declare module "jquery/src/jquery" { export = $; }
似乎让我使用“import ...” - 但这是处理这个问题的好方法吗?
编辑2:
回复@ basarat下面的答案(我的评论有点长,无需换行就可以阅读):
我已经使用了DefinitelyTyped中的jquery def,但它本身不起作用,因为我要求的模块是“jquery / src / jquery”而不仅仅是 “jquery的”即可。如果我使用“jquery”,那么加载了jquery的编译dist版本,这对于Bootstrap加载器不起作用。
因此,我认为declare module "jquery/src/jquery" { export = $; }
扩展了现有的定义,但使用了我需要的路径来加载它。
答案 0 :(得分:0)
import jquery = require(' jquery / src / jquery.js');
使用jquery的明确类型定义:https://github.com/borisyankov/DefinitelyTyped/blob/master/jquery/jquery.d.ts#L3158-L3160已允许您执行import jquery = require('jquery')
。
答案 1 :(得分:0)
要回答我自己的问题,这就是我最终要做的事情。
NB我不知道这是否是正确的"实现这一目标的方式(我怀疑不是这样),所以我对任何有更好答案的人开放!
在我的TS定义文件tsd.d.ts中,我有绝对类型的jQuery定义:
/// <reference path="jquery/jquery.d.ts" />
但就其自身而言,这还不足以让编译器从 node_modules 文件夹中获取jQuery源文件。
在tsd.d.ts进一步说明我已经补充道:
declare module "jquery/src/jquery"
{
export = $;
}
编译器现在可以找到jQuery源文件。
我还必须编辑一个用于WebPack编译器的jQuery源文件才能很好地使用它: selector.js 默认情况下不包含工厂函数,而WebPack需要一个人在场。
有一个loader that says it fixes this但是我无法让它工作,所以我只是将selector.js中的代码更改为:
define([ "./selector-sizzle" ], function(){});
这一切都让人觉得有点hacky ......但它让我超越了这个特殊的障碍。