TypeScript 中有一些简单的东西我在这里缺少......
使用 Chrome 运行我的代码，我有一个工作打字稿环境，并且所有其他代码/模块都按预期工作。
当我从 .d.ts 导入时，所有内容都会编译，没有错误/警告，但我在 Chrome 中收到运行时错误，因为生成的 JavaScript 试图从不存在的文件导入。
import { doSomething } from "exampleJsLibrary";
在浏览器中失败，因为 TypeScript 不会将 exampleJsLibrary.d.ts 转换为 JS 文件。
我的目标是 es5，使用 es6 模块输出，并使用 tsc 来构建（没有 webpack/browserify 工具），ts 2.7.2。
完整示例：
<!DOCTYPE html>
<html>
<head>
<script>
var exampleJsLibrary = (function() {
return {
doSomething: function(x) { return x + 1 }
}
})()
</script>
<script type="module" src="./built/myCode.js"></script>
</head>
<body>
</body>
</html>
和
// exampleJsLibrary.d.ts
export const doSomething(x: number): number;
export as namespace exampleJsLibrary;
// myCode.ts
import { doSomething } from "./exampleJsLibrary";
function test() {
console.log(doSomething(3));
}
// tsconfig.json
...
"target": "es5",
"lib": ["dom", "es5", "es2015.iterable", "es2015"],
"outDir": "built",
"module": "es6"
...
发生失败的原因是 myCode.js 的生成代码仍然包含该行import { doSomething } from "./exampleJsLibrary"，这会导致运行时错误，因为没有 exampleJsLibrary 或 exampleJsLibrary.js。如果我将生成的 JS 中的该行替换为var doSomething = exampleJsLibrary.doSomething，则一切正常。
如何从 .d.ts 导入？
.d.ts 声明文件仅包含类型声明，而不包含实际代码。（它们就像 C/C++ 中的头文件，如果您碰巧熟悉的话。）您需要在项目中包含实际的库代码，然后导入它或全局定义它以使其在运行时工作。
在您的情况下，由于库代码作为全局代码包含在页面上，因此您不需要使用import. 相反，你可以说：
const doSomething = exampleJsLibrary.doSomething
如果编译器抱怨exampleJsLibrary未定义，最简单的解决方法是将其添加到文件顶部（使用 .d.ts 的实际相对路径）：
/// <reference path="path/to/exampleJsLibrary" />
（请注意，如果您的包是从 npm 包含的，则方法会有所不同，这很常见。）
| 归档时间： |
|
| 查看次数： |
1810 次 |
| 最近记录： |