javascript - TypeScript 中导入模块的增强类型

Question

我正在将现有代码库从 js/react/jsx 设置转换为 TypeScript。当然，我想逐个文件地执行此操作，并且对如何使 TS 编译器与现有 js 代码库一起工作有疑问。

我转换文件 index.js 但想暂时将 foo.js 保留在 JavaScript 中:

// index.ts

import { fooFunction } from 'foo';

foo({ val: 1 });

<小时/>

// foo.js

export const fooFunction = ({ val, optionalProp }) => {
  //...
}

此示例中的问题是，TypeScript 自动将参数推断为 foo 并提示 类型 { val:string, optionalProp:any } 中缺少属性“optionalProp”

需要“ stub ”fooFunction 的类型让我寻找，我发现了一些可以做到这一点的方法:

1) 使用 require 而不是 import

// index.ts
var fooFunction: any = require('foo').fooFunction;

2) 合并声明

?

3) 添加带有 foo 自定义声明的 d.ts 文件 - 尚未尝试，但似乎不方便

理想情况下，我不必执行 (1) 因为我想继续使用导入语法，并且我不必执行 (3) 因为这会要求我添加声明文件，以便稍后在我准备好转换 foo 时删除它们。

(2) 听起来很棒，但我找不到可行的解决方案。

// index.ts

declare module 'foo' {
  function fooFunction(options: any): any
}

不起作用并抛出无法重新声明 block 范围变量“fooFunction”

我该怎么做？是否有文档包含我正在尝试执行的操作的示例和/或对声明合并以及如何使用 namespace/interface/value 有更多解释？ 是否有更好的方法来逐步过渡到 TypeScript？

Answer 1

这可能行不通，只是想以此作为序言 - 我对 React 知之甚少 - 但我确信你可以在变量上使用 ? 来实现它“选修的”。我之前在函数中使用过这个

myFooFunction(requiredParam: typeA, optionalParam?: typeB) { ... }

您应该考虑的另一件事是 Typescript 可以在编译时添加一些类型检查，因此在我看来，您应该尽可能地利用它。

编辑:要使用可选参数，您只需检查它是否存在即可。

myFooFunction(requiredParam: typeA, optionalParam?: typeB) {
  if (optionalParam) { // if this results to true, the param was given
    //do something
  }
}