如何从另一个脚本加载现有的typescript文件以提高性能？

我有一个TypeScript文件，在其中捕获DOM上发生的事件并将数据流发送到AWS Kinesis。我目前在HTML中使用该脚本进行测试

<script type="text/javascript" src="./tracker.ts?projectId=123&apiKey=trac3ab1e-50fa-50b5-dab5-acce55e5cafe"></script>

tracker.ts

有一个类

tracker

，在这个类中我还加载了AWS SDK，并将数据流发送到Kinesis

我想从另一个脚本加载这个

tracker.ts

。我没有什么困惑

• 如何实施
• 这有多可行
• 它将如何影响性能

对于实现，我尝试了一些事情

首先，我将

中的

type=“application/javascript”

更改为

type=“module”

，这没有帮助，而且部分代码没有被读取

---

第二，我试图从中导入

tracker.ts

的

tracker

类作为模块，但我对如何在我的案例中实现它感到困惑。我还收到一条警告，说

tracker.ts

不是一个模块。

我想你真的很困惑。 首先，不能直接加载TypeScript文件。 您需要将typescript代码编译成浏览器可以理解的javascript。 其次，您尝试使用参数加载tracker.ts（？projectd=123&apiKey=trac3ab1e-50fa-50b5-dab5-acce55e5cafe） 你不能这样做。 如果正在加载internet上的外部资源，则可以执行此操作。 我真的建议在尝试像AWS这样的东西之前先学习基础知识

编译打字稿 在终端中运行：

npm安装tsc

然后运行：

tsc tracker.ts

然后，您将看到一个tracker.js文件。 然后加载这个文件

关于参数： 不要使用参数：

在加载tracker.js脚本之前，添加以下内容：

<script>
window.projectId = 'somethin'
window.apiKey = 'somethin'
</script>

---

注意：更改tracker.ts后，再次运行

tsc tracker.ts

，这样更改将反映tracker.js

这只是一个测试项目，用于编译我使用过的包，它创建了包。我理解。默认情况下，parcel不编译TypeScript。请不要担心，在

npm运行dev

之后，index.html将附加js文件

src=“tracker.6546546.js？projectId=123&apiKey=trac3ab1e-50fa-50b5-dab5-acce55e5cafe”

噢，对不起。但不能加载带有参数的脚本，如？projectId。在我的回答中，我向您展示了如何克服这个问题。我不认为这会是一个问题，因为我有一种方法来解析脚本查询字符串中的所有内容，这里的主要问题是，我希望在主页上附加一个不同的文件，然后加载

tracker

文件。

<script>
window.projectId = 'somethin'
window.apiKey = 'somethin'
</script>

const projected = window.projectId;
const apiKey = window.apiKey