一、问题

使用TypeScript时，有时会遇到编译器报错“Cannot redeclare block-scoped variable XXX”。

新建一个空的npm工程，添加TypeScript依赖，创建一个index.ts，里面只写上这一行：

const name = "Tom";

编译器的报错为Cannot redeclare block-scoped variable 'name'. [2451]。

二、原因

之所以出现这样的原因有两个。

一是，如果一个.ts文件没有包含import或export，那么它会被视为脚本，该文件中所有的内容都会被视为全局的，其它文件可以直接使用[1]。反之如果使用了import或export，那该文件就会被视为一个module，里面的内容只有被别的文件import了才能使用。在上面这个文件中，index.ts没有使用import或export，所以这个变量name是全局的。

二是，TypeScript 会添加一些 lib 作为全局运行的环境，这些环境的值是全局的[2][3]。TypeScript （当前版本为3.2）默认支持的是ES5环境，这个环境包含了DOM、ES5和ScriptHost这三个library。其中DOM会声明name这个变量（在lib.dom.d.ts中），也就是浏览器中的window.name。index.ts中的name也是全局的，所以产生了冲突。

三、解决方案

解决方案有两个。

一是，添加import或export，将index.ts变为一个模块。

二是，更改编译器的编译选项，去掉DOM这个library[3]。tsconfig.json中的选项lib就是用于控制添加哪些library的[4]。在选项里将DOM去掉可。有时这个选项并没有显式设置，需要手动创建这个字段。

四、参考资料

1. https://www.typescriptlang.org/docs/handbook/modules.html
2. https://stackoverflow.com/a/46233014
3. https://github.com/Microsoft/vscode/issues/22436#issuecomment-286187943
4. https://www.typescriptlang.org/docs/handbook/compiler-options.html