无法将模块声明添加到导出函数

Question

我最近开始使用Typescript，我想在我的应用程序中需要一个npm模块。由于所述npm模块没有它自己的类型定义，我还决定将它分叉并添加我自己的。这有多难？

Here是我在项目中安装的npm模块：

/**
 * Given a number, return a zero-filled string.
 * From http://stackoverflow.com/questions/1267283/
 * @param  {number} width
 * @param  {number} number
 * @return {string}
 */
module.exports = function zeroFill (width, number, pad) {
  if (number === undefined) {
    return function (number, pad) {
      return zeroFill(width, number, pad)
    }
  }
  if (pad === undefined) pad = '0'
  width -= number.toString().length
  if (width > 0) return new Array(width + (/\./.test(number) ? 2 : 1)).join(pad) + number
  return number + ''
}

很简单，它只导出一个函数。现在让我们看看如何让打字稿与它一起工作......

尝试＃1：

定义

declare module "zero-fill"{
     export function zeroFill(width:number, num:number, pad?:string|number):string
     export function zeroFill(width:number):{(num:number, pad?:string|number):string}
}

源代码

import * as zeroFill from "zero-fill";
console.log(zeroFill(10, 10));

生成的代码

"use strict";
exports.__esModule = true;
var zeroFill = require("zero-fill");
console.log(zeroFill(10, 10));

这个生成的代码有效，但同时会出错。我的IDE也没有自动完成功能。

Cannot invoke an expression whose type lacks a call signature. Type 'typeof "zero-fill"' has no compatible call signatures.

尝试＃2

定义

declare module "zero-fill"{
     // Notice the default keywords
     export default function zeroFill(width:number, num:number, pad?:string|number):string
     export default function zeroFill(width:number):{(num:number, pad?:string|number):string}
}

来源

import zeroFill from "zero-fill";
console.log(zeroFill(10, 10));

生成的

"use strict";
exports.__esModule = true;
var zero_fill_1 = require("zero-fill");
console.log(zero_fill_1["default"](10, 10));

在这里，我更喜欢我在typescript中使用的语法，编译器似乎也喜欢它。零编译器错误以及类型提示工作在IDEA上。太糟糕了，生成的代码在运行时会出现TypeError: zero_fill_1.default is not a function错误...

尝试＃3

定义

declare module "zero-fill"{
    function zeroFill(width:number, num:number, pad?:string|number):string
    function zeroFill(width:number):{(num:number, pad?:string|number):string}
    export {zeroFill};
}

来源

import {zeroFill} from "zero-fill";
console.log(zeroFill(10, 10));

生成的

"use strict";
exports.__esModule = true;
var zero_fill_1 = require("zero-fill");
console.log(zero_fill_1.zeroFill(10, 10));

与以前完全一样......编译器和IDE就像这样，但运行时并没有

我可以继续，但我相信你明白了。是否有可能使这个npm模块在打字稿中可用，而无需更改它的实际代码？我做错了什么以及如何正确导入此功能？

Answer 1

我相信你正在寻找this documentation

$

然后将其导入为：

declare module 'zero-fill' {
    function zeroFill() /* etc. */
    export = zeroFill;

    /* for any additional types */
    namespace zeroFill {
        interface FooBar { /* ... */ }
    }
}