如何在typescript中解决 error TS2451: Cannot redeclare block-scoped variable 'name'

问题

昨天用 Typescript 从零搭建一个 nodeJS项目时，遇到一个声明常量 name 的报错。代码如下：

1 const name = 'youthcity';
2 
3 function greeter(name:string) {
4   return `Hello ${name}`;
5 }
6 
7 console.log(greeter(name));

 console.log(greeter(name));

一个不到8行的代码，IDE却报了一个错误。明明与其他文件没有相互依赖，却会提示 [ts] 无法重新声明块范围变量“name”。。且该文件目录夹下，也没有其他文件。为什么会有这个报错呢？ㄟ( ▔, ▔ )ㄏ

原因

在默认状态下，typescript 将 DOM typings 作为全局的运行环境，所以当我们声明 name时，与 DOM 中的全局 window 对象下的 name 属性出现了重名。因此，报了 error TS2451: Cannot redeclare block-scoped variable 'name'. 错误。

解决方法

解决这个问题，思路有两个：

方法一

将运行环境由 DOM typings 更改成其他运行环境。
我们可以在 tsconfig.json 中做一下声明：

1 {
2     "compilerOptions": {
3         "lib": [
4             "es2015"
5         ]
6     }
7 }

方法二

既然与全局的变量出现重名，那我们将脚本封装到模块（module）内。module 有自己的作用域，自然不会与全局作用域的变量产生冲突。

在 Typescript 中，只要文件存在 import 或 export 关键字，都被视为 module

 1 const name = 'youthcity';
 2 
 3 function greeter(name:string) {
 4   return `Hello ${name}`;
 5 }
 6 
 7 
 8 console.log(greeter(name));
 9 
10 export {};