[英]Can Typescript import Webpack UMD?
使用TypeScript,是否有某种方法可以import
由webpack UMD(通用模块定义)包装的模块? 例如:
npm install knockback
.js文件( node_modules/knockback/knockback.js
)的开头如下:
(function webpackUniversalModuleDefinition(root, factory) {
if(typeof exports === 'object' && typeof module === 'object')
module.exports = factory(require("knockout"), require("backbone"), ....
else if(typeof define === 'function' && define.amd)
define(["knockout", "backbone", "underscore"], function webpackLoadOptionalExternalModuleAmd( ....
});
else if(typeof exports === 'object')
exports["kb"] = factory(require("knockout"), require("backbone"), require("underscore"), (function ....
else
root["kb"] = factory(root["ko"], root["Backbone"], root["_"], root["jQuery"]);
当我尝试将其导入.ts文件时,tsc会产生错误:
import * as k from 'knockback/knockback';
TS2307: Build: Cannot find module 'knockback/knockback'.
有什么我可以做的,没有编辑knockback.js文件,说服tsc导入这个.js? 我正在使用Typescript 1.8。
当我尝试将其导入.ts文件时,tsc会产生错误:
您可以非常轻松地使用类型定义文件
file knockback.d.ts
declare module 'knockback/knockback' {
var foo: any;
export = foo;
}
仅供参考,对于其他人谁在这里结束了试图用通过打字稿knockback.js,有一个预先存在的knockback.d.ts
可以从文件DefinitelyTyped 。 但是,现有的.d.ts不包含export
,因此不能与外部模块一起使用。 基于basarat的答案,我修改了.d.ts文件如下:
1)添加以下内容:
declare module "knockback" {
export = Knockback;
}
2)从结尾删除declare var kb: Knockback.Static
。
3)删除interface Static extends Utils {
wrapper并将Static
接口内的所有内容移动到命名空间范围。 例:
interface Static extends Utils {
ViewModel;
CollectionObservable;
collectionObservable(model?: Backbone.Collection<Backbone.Model>, options?: CollectionOptions): CollectionObservable;
observable(
/** the model to observe (can be null) */
model: Backbone.Model,
/** the create options. String is a single attribute name, Array is an array of attribute names. */
options: IObservableOptions,
/** the viewModel */
vm?: ViewModel): KnockoutObservable<any>;
...
}
function collectionObservable(model?: Backbone.Collection<Backbone.Model>, options?: CollectionOptions): CollectionObservable;
function observable(
/** the model to observe (can be null) */
model: Backbone.Model,
/** the create options. String is a single attribute name, Array is an array of attribute names. */
options: IObservableOptions,
/** the viewModel */
vm?: ViewModel): KnockoutObservable<any>;
...
完成这些更改后,用法如下所示:
import * as kb from 'knockback';
class MyViewModel extends kb.ViewModel {
public name: KnockoutObservable<string>;
constructor(model: Backbone.Model) {
super();
this.name = kb.observable(model, "name");
}
}
var model = new Backbone.Model({ name: "Hello World" });
var viewModel = new MyViewModel(model);
kb.applyBindings(viewModel, $("#kb_observable")[0]);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.