Question

我们在react项目中使用名为Grapnel的客户端路由库。这个库没有可用的定义文件，所以我编写了自己的工作，但我必须将其创建为一个全局模块并加载脚本。通过脚本标记的方式。这不是最佳选择，因为 all 项目中的其他javascript是由webpack捆绑的。

通过npm安装Grapnel;我希望能够在webpack中捆绑Grapnel，并且当我们应该将定义写为全局时，我也很好奇。 Grapnel是用ES5语法编写的：

!(function(root) {

    function Grapnel(opts) {
    ....
}).call({}, ('object' === typeof window) ? window : this);

因此需要实例化如下

new Grapnel({options});

我是否可以编写.d.ts以便我可以使用ES6模块导入语句？或者我需要将Grapnel称为全局变量吗？如果我必须使用全局定义，那是否会妨碍在webpack中捆绑？

这是我的工作（全球）版本：

// Type definitions for grapnel
// Project: https://github.com/baseprime/grapnel
// Definitions by: Trevor Kilvington <http://trevorgk.js.org>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
type GrapnelEvent = "navigate" | "match" | "hashchange";

interface GrapnelOptions {
  pushState?: boolean,
  root?: string,
  hashBang?: boolean
}

interface Routes {
  [route: string]: () => void;
}

declare class Grapnel  {
  constructor(init?: GrapnelOptions)
  get(route:string|RegExp)
  navigate(route:string)
  on(eventName:GrapnelEvent, callback:() => any)
  once(eventName:GrapnelEvent, callback:() => any)
  trigger(eventName:GrapnelEvent, ...eventArgs: any[] )
  context(routeContext:string, middleware: any): () => any
  path(newPath: string)
  path(clear: boolean)
  listen(routes: Routes)
}

declare module "grapnel" {
  export = Grapnel;
}

感谢您提出的任何建议。我是写作.d.ts的新手，但我熟悉打字稿和消费类型。

将自定义全局打字稿定义转换为模块

0 个答案: