因此，我尝试将JQueryUI与TypeScript一起使用，到目前为止，我已经将JQueryUI与npm install jquery-ui-dist和一起安装了JQuery npm install jquery。我还使用npm install --save-dev @types/jquery和从DefinitelyTyped添加了定义文件npm install --save-dev @types/jquery-ui。
我有以下文件（省略了一些部分）：
///<reference path="../../node_modules/@types/jqueryui/index.d.ts"/>
import * as $ from "jquery";
import "jquery-ui";
export default class Resizer {
public static extraMargin = 5;
public static setVerticalResizer(...) {
...
let topElem: HTMLElement = <HTMLElement> cardElem.querySelector(".my-class");
$(topElem).resizable({
...
});
}
}
在构建和运行时，出现以下错误：
Uncaught TypeError: r(...).resizable is not a function
所以我想我的导入JQueryUI的方式有问题吗？还是JQueryUI未正确安装？尽管导入和定义在VS Code中似乎正常工作。
这也是我在HTML文件中使用它们的方式：
<script src="node_modules/jquery-ui-dist/jquery-ui.mis.js"></script>
<link rel="stylesheet" href="node_modules/jquery-ui-dist/jquery-ui.min.css">
关于如何解决问题以及将JQueryUI与TypeScript结合使用的任何想法？
这不是TypeScript错误，这是运行时错误。
jQueryUI实际上被加载了两次！
通过脚本标签一次
<script src="node_modules/jquery-ui-dist/jquery-ui.mis.js"></script>
然后再次在您的模块中
import $ from "jquery";
import "jquery-ui";
export default class ....
上面模块中的代码是正确的，但是脚本标记导致失败。
另外，我看到你有
///<reference path="../../node_modules/@types/jqueryui/index.d.ts"/>
删除这个！尽管它不会引起运行时问题，但该构造仅在使用全局变量而不是模块编写应用程序代码时使用。
如果没有自动选择类型，请指定
"compilerOptions": {
"moduleResolution": "node"
}
或使用（与node_modules旁边的tsconfig.json一起显示）
"compilerOptions": {
"baseUrl": ".", // required with paths but can be something besides "."
"paths": {
"jquery-ui": [
"node_modules/@types/jqueryui/index"
]
}
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句