This答案建议手动添加对所有使用的 .ts 文件生成的 .js 文件的引用。
我打算使用 library具有复杂的结构。我已经将顶级文件添加到我的 html 中，但它们有子引用，其中有子子引用等。
如果 app.ts 开头为
/// <reference path="yendor/src/yendor/yendor.ts" />
/// <reference path="yendor/src/umbra/umbra.ts" />
/// <reference path="yendor/src/gizmo/gizmo.ts" />
/// <reference path="yendor/src/game/base.ts" />
/// <reference path="yendor/src/game/persistence.ts" />
/// <reference path="yendor/src/game/custom_events.ts" />
/// <reference path="yendor/src/game/actor.ts" />
/// <reference path="yendor/src/game/effects.ts" />
/// <reference path="yendor/src/game/item.ts" />
/// <reference path="yendor/src/game/creature.ts" />
/// <reference path="yendor/src/game/map.ts" />
/// <reference path="yendor/src/game/gui.ts" />
/// <reference path="yendor/src/game/engine.ts" />
我可以离开吗
<script src="app.js"></script>
而不是
Whatever else is used by other libraies
<script src="yendor/src/yendor/yendor.js"></script>
<script src="yendor/src/umbra/umbra.js"></script>
<script src="yendor/src/gizmo/gizmo.js"></script>
<script src="yendor/src/game/base.js"></script>
<script src="yendor/src/game/persistence.js"></script>
<script src="yendor/src/game/custom_evenjs.js"></script>
<script src="yendor/src/game/actor.js"></script>
<script src="yendor/src/game/effecjs.js"></script>
<script src="yendor/src/game/item.js"></script>
<script src="yendor/src/game/creature.js"></script>
<script src="yendor/src/game/map.js"></script>
<script src="yendor/src/game/gui.js"></script>
<script src="yendor/src/game/engine.js"></script>
<script src="jquery-1.11.1.min.js"></script>
<script src="pixi.min.js"></script>
<script src="app.js"></script>
在index.html内？
我使用 Visual Studio 2015 来构建它。
最佳答案
您可以通过以下方式做到这一点:
- 使用 typescript 组织您的代码 modules
- 使用模块加载器(systemjs 等)自动加载模块
遵循这两条规则，您的 index.html 将如下所示:
<!doctype html>
<html>
<head>
<script src="lib/systemjs/dist/system-polyfills.src.js"></script>
<script src="lib/systemjs/dist/system.src.js"></script>
<script>
System.defaultJSExtensions = true;
</script>
</head>
<body>
<script>
document.addEventListener("DOMContentLoaded", function(event)
{//Entry point of the application.
System.import('app').catch(function(e)
{
console.error(e);
});
});
</script>
</body>
</html>
无需包含每个文件。
关于javascript - 如何在不污染html的情况下使用庞大的typescript库？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35685702/