我正在尝试使用RequireJS和打字稿AMD模块加载Bootstrap。
目前我在requireJS配置中有以下内容:
require.config({
shim: {
bootstrap: { deps: ["jquery"] }
},
paths: {
jquery: "//code.jquery.com/jquery-2.1.4.min",
bootstrap: "//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min",
d3: "//d3js.org/d3.v3.min"
}
});
然后在我希望做的课程中:
import jq = require("jquery");
import bootStrap = require("bootstrap");
class test {
public doStuff(): void {
jq("#test").carousel();
}
}
由打字稿编译成:
define(["require", "exports", "jquery"], function (require, exports, jq) {
var testViewModel = (function () {
function testViewModel() {
}
testViewModel.prototype.doStuff = function () {
jq("#test").carousel();
};
return testViewModel;
})();
})
所以问题似乎是因为bootstrap扩展了jquery并且实际上没有直接使用它不会输出到已编译的javascript中。
我可以在我的课程中的某处包含一个引导程序来修复问题,但这有点容易出错。
我错过了什么?
答案 0 :(得分:3)
除非您使用导入的名称作为变量,否则代码import bootStrap = require("bootstrap");
不会生成任何js。这样,您就可以lazy loading
和importing type only
作为documented here。
import jq = require("jquery");
import bootStrap = require("bootstrap");
let bs = bootStrap;
更好地将此类代码移至ui.ts
,然后在任何地方导入该文件,例如ui.tsx