解决 cannot redeclare block-scoped variable 问题

cannot redeclare block-scoped variable

依照5分钟上手TypeScript，全局安装typescript，新建.ts文件main.ts，编译main.ts，得到main.js。

//main.ts
type IdDisplay = {
    id:string,display:string
}const list:IdDisplay[] = [{
    id:"foo",display:"共和国勋章"},{
    id:"bar",display:"七一勋章"}
];const fooIndex = list.map(item => item.id).indexOf("foo");
console.log(fooIndex);

//main.js
var list = [{
    id: "foo",display: "共和国勋章"},{
    id: "bar",display: "七一勋章"}
];
var fooIndex = list.map(function (item) {
     return item.id; }).indexOf("foo");
console.log(fooIndex);

我这边使用的是编辑器是vscode，编译完后，编译器报错：Cannot redeclare block-scoped variable ‘list’。

其实，main.ts中的代码并没有问题，只不过ts中声明的变量、函数等被放在全局作用域中，而在编译生成的main.js里，也有同样的一份变量名、函数，所以vscode会报错提示说"redeclare"。
针对上述问题，可以在main.ts中添加export {}，让typescript认为main.ts是一个模块，这样就避免报错了。

//main.ts
export {
    };
type IdDisplay = {
    id:string,display:string
}const list:IdDisplay[] = [{
    id:"foo",display:"共和国勋章"},{
    id:"bar",display:"七一勋章"}
];const fooIndex = list.map(item => item.id).indexOf("foo");
console.log(fooIndex);

编译main.ts，得到main.js 。

"use strict";
exports.__esModule = true;
var list = [{
    id: "foo",display: "共和国勋章"},{
    id: "bar",display: "七一勋章"}
];
var fooIndex = list.map(function (item) {
     return item.id; }).indexOf("foo");
console.log(fooIndex);

参考文章

5分钟上手typescript
解决typescript Cannot redeclare block-scoped variable