TypeScript中trace函数报错ReferenceError: trace is not defined求助

我尝试在TypeScript代码中使用trace函数，已在.d.ts文件中进行如下声明：

declare function trace(arg: string | number | boolean);
declare function trace(arg: { id: number; name: string });

但在index.ts文件中按如下方式调用该函数时：

trace("trace with string"); // 传入字符串调用trace函数
trace(true); // 传入布尔值调用trace函数
trace(1); // 传入数字调用trace函数
trace({ id: 1, name: "test" }); // 传入对象调用trace函数

出现错误：

ReferenceError: trace is not defined

tsconfig.json中的declaration选项已启用，请问我哪里出错了？

补充说明：
以下是定义trace函数的JS文件代码：

var ErrorHelper = (function () {
    return {
        containsErrors: function (response) {
            if (!response || !response.responseText)
                return false;

            var errorValue = response.responseText;

            if (String(errorValue.failure) === "true"
                || Boolean(errorValue.failure)) {
                return true;
            }
            return false;
        },
        trace: function (msg) {
            var traceMessage = msg;
            if (msg.responseText) {
                traceMessage = msg.responseText.errorMessage;
            }
            console.log("[" + new Date().toLocaleTimeString()
                + "] " + traceMessage);
        }
    }
})();

问题根源 #

你在.d.ts里声明的是全局trace函数，但实际JS代码中trace是ErrorHelper对象的方法，并非全局函数，两者不匹配，导致运行时找不到全局的trace。

修复步骤 #

1. 修正类型声明
   替换.d.ts中的全局函数声明，改为对ErrorHelper全局对象的类型定义：

   declare const ErrorHelper: {
       containsErrors(response: any): boolean;
       trace(arg: string | number | boolean | { id: number; name: string }): void;
   };
   

   这样TypeScript就能正确识别ErrorHelper对象及其包含的trace方法。

2. 调整函数调用方式
   在index.ts中调用trace时，必须通过ErrorHelper对象访问：

   ErrorHelper.trace("trace with string");
   ErrorHelper.trace(true);
   ErrorHelper.trace(1);
   ErrorHelper.trace({ id: 1, name: "test" });
   

3. 确保JS文件正确加载
   要保证定义ErrorHelper的JS文件在TypeScript编译后的代码之前加载（比如在HTML中用<script>标签优先引入该JS文件），否则运行时仍会出现找不到ErrorHelper的错误。

内容的提问来源于stack exchange，提问作者Usama Ahmed