为js函数编写d.ts文件的正确方法是什么？

Question

我知道有很多与此问题相关的问题。我再次搜索并两次阅读所有问题。我得到了一些结果但并非我想要的全部。请帮我找出错误。

这些是我的js和d.ts文件

//other.js file
function myFunction() {
console.log("Hello from d.ts file");
}

并且

//other.d.ts file
export module other {
  function myFunction(): void;
}

我使用像我这样的组件

ngOnInit() {
  console.log((other as any).myFunction());
}

我的导入声明如下：

import * as other from '../js/other'

所有内容编译都很好并且构建成功但是当我在localhost上检查它时会出错：

  

错误错误：未捕获（在承诺中）：TypeError： WEBPACK_IMPORTED_MODULE_3__js_other .myFunction不是函数   TypeError： WEBPACK_IMPORTED_MODULE_3__js_other .myFunction不是函数       在MineComponent.webpackJsonp.156.MineComponent.ngOnInit（mine.component.ts：39）

我的目录是这样的：

Answer 1

您的other.js文件应该封装在一个类中，并且应该在要使用的导出中可用。

    //other.js file
var other = (function(){

  function other(){
    //init class properties...
  }
  other.prototype.myFunction = function() {
     console.log("Hello from d.ts file");
  } 
    /**
    * add to global namespace
    */


} )();
exports.other = other;

然后在您的组件ts文件中，您可以直接在导入级别写入文件顶部来使用它： -

declare var other:any 

或者，如果你正确地提到你的.d.ts文件，就像类及其protype属性一样，作为其内部函数： -

//other.d.ts
export declare class other{
  myFunction(): void;
}