我已经尝试了所有的答案,但我已经堆积了错误,如
main.js:2未捕获的ReferenceError:未定义导出
当我使用编译es5作为目标
和
未捕获的SyntaxError:意外的令牌{
当我使用编译es6作为目标
main.ts
import {MyLib} from './mylib';
let myLib = new MyLib("Anonymous", "Someone");
console.warn(myLib);
mylib.ts
export class MyLib {
constructor(public a: String, public b: String) {
}
toString() {
return "library tostring: " + this.a + " " + this.b;
}
}
tsconfig.json
{
"compilerOptions": {
"target": "es6",
"sourceMap": true
},
"exclude": [
"node_modules"
]
}
的index.html
<html>
<head>
<title>
ts-demo !!
</title>
<script type="module" src="./require.js"></script>
<script type="module" src="./system.min.js"></script>
<script src="./tsdemo/main.js"></script>
</head>
<body>
</body>
</html>
<script>
类型设置为module
以使ES6模块工作,如:<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="module" src="./tsdemo/main.js"></script>
</head>
<body>
</body>
</html>
.js
扩展名才能使其在浏览器中运行。 Typescript编译器没有自动添加它的选项(https://github.com/Microsoft/TypeScript/issues/16577),但您可以在main.ts
文件中添加扩展名,例如: import {MyLib} from './mylib.js';
let myLib = new MyLib("Anonymous", "Someone");
console.warn(myLib);
tsc做正确的事情并从.ts
文件中解析类型,保留生成的javascript中的扩展名