Javascript 在Typescript中的文件中本地处理全局变量

我公司的工作方式很奇怪。我们使用PHP模板引擎将所有文件复制到单个HTML中并提供服务。具体如下：

主html

<script>
    (() => {
        const foo = 'bar';
        {{ include('xxx.js') }}
    })
    {{ include('zzz.js') }}
</script>

如您所见，IIFE有两层，一层在主HTML中，另一层在每个

.ts

中，以确保变量的范围正确包含在每个

.ts

文件中。然后我使用

tsc

将

xxx.ts

编译成

xxx.js

问题是，现在我有一个额外的文件

yyy.ts

，我想在

main.html

的iLife中包含在

xxx.ts

的正下方。让我们假设

yyy.ts

与

xxx.ts

完全相同

yyy.ts

declare const foo: string;
(() => {
    console.log(foo);
})()

在这两个文件中，我都在

foo

处遇到了一个问题。错误是

无法重新声明块作用域变量

我无法将

foo

放入

global.d.ts

文件，因为它不是全局文件，因为它只对

xxx.js

和

yyy.js

我读了一些书，发现TS编译的方式是，如果文件没有

导入/导出

，它会将所有变量视为全局变量

我如何解决这个问题？我能想到的两种方法是：

• 找到一种方法设置

  tsconfig

  ，将每个文件视为单独的文件。我还没有找到解决这个问题的好办法
• 在

  .ts

  文件中，声明IIFE中的全局变量。但是我遇到了错误

  修饰符不能出现在这里

---

任何帮助都将不胜感激。谢谢

我觉得你不明白我的观点，我的生活是用PHP而不是TS完成的。所以我觉得如果我举一些例子的话可能会有意义

从我收集到的信息来看，您有一个名为foo的全局变量，您希望它包含在xxx&zzz中

首先，不要把生命放在TS文件里。否则，就像您发现您将要获取的

无法重新声明块作用域变量

所以下面是一个想法，我相信你会做什么后

文件xxx.TS

declare const foo: string;

const msg = "hello";
console.log(`${msg) ${foo)`);

文件zzz.TS

declare const foo: string;

const msg = "goodbye";
console.log(`${msg) ${foo)`);

现在，如果在我们的PHP文件中我们做了->

<script>
    (() => {
      const foo = 'bar';
      (() => { {{ include('xxx.js') }} })
      (() => { {{ include('yyy.js') }} })
    })
</script>

---

而且上述任何一项都不会污染您的windows global。

声明需要使用相同名称的具体原因是什么？也许可以让您的PHP脚本创建IIFE@SeppeMariën我的一些变量实际上是全局变量，但只是一些文件，而不是其他文件。但是，问题是TS将我的所有文件视为已连接。因此，我发表的声明越多，全球范围内的污染就会越严重be@Keith问题不在于编译的范围，所以IIFE是好的，不管我如何生成它。问题在于TS将我的所有文件都视为已连接，这意味着所有声明的变量都已连接到是，但这是正常行为。它甚至不是typescript，而是Javascript。Typescript只是警告您。据我所知，您需要导入文件的唯一方法如下：

，但正如您所说，是php包含了文件。问题是tsc将读取此

声明常量foo:string并认为它们是重复的，因此抛出
无法重新声明块作用域变量
错误。原因是TSC认为每一个没有导入/导出的文件都是一个全局文件，其中声明的任何东西都是全局文件。因此，在您的情况下，如果在
zzz.ts
中，我指的是
foo
，
tsc
仍然可以。这不是关于编译的js，因为我知道它是正确的js，而是关于tsc理解变量的范围incorrectly@TreeNguyen我以为你是单独编的。IOW:
tsc xxx.ts
和
tsc yyy.ts
，而不仅仅是
tsc
。。如果您想自己使用
tsc
，您需要将xxx&yyy与它自己的
tsconfig.json
一起放在它自己的目录中，并使用
include
选项。这种方法的优点也让编辑们感到高兴。单独使用一个tsconfig执行
tsc
会将所有文件视为一个项目，这就是为什么您得到
不能重新声明块作用域变量的原因
您还可以创建多个tsconfig文件，并使用
--project
选项，但我认为单个目录是更容易的选项。您还可以在每个目录中使用
导入
/
导出
，以创建一种定制的捆绑系统，每个目录可以编译为一个文件，但仍将
xxx
和
yyy
作为一个文件。
<script>
    (() => {
      const foo = 'bar';
      (() => { {{ include('xxx.js') }} })
      (() => { {{ include('yyy.js') }} })
    })
</script>

hello bar
goodbye bar