javascript - vanilla javascript/HTML中的空导出{}是什么意思

Question

在 Google Maps Javascript API 示例中，我看到他们在 HTML 中有这样的内容:

<script type="module" src="./index.ts"></script>

以及 TS/JS 脚本末尾的空导出语句。

let map;
function initMap() {
    map = new google.maps.Map(document.getElementById("map"), {
        center: { lat: -34.397, lng: 150.644 },
        zoom: 8,
    });
}
window.initMap = initMap;
export {};

我在 MDN 上没有看到任何示例或提及空导出，所以我想知道是否有人知道它是如何工作的。如果导出为空，脚本如何知道运行它。

Answer 1

这看起来像 中的内容 typescript ;它与 JavaScript 无关。

如果出现以下任何一种情况，那么您将需要一个 import/export在文件中。

使用下面的标志调用 TypeScript 文件。

--isolatedModules

tsconfig.json文件具有以下键和值。

{
  "isolatedModules": true
}

根据 typescriptlang.org ， 它指出:

If isolatedModules is set, all implementation files must be modules (which means it has some form of import/export). An error occurs if any file isn’t a module.

如果您尝试使用 --isolatedModules 运行 TypeScript 文件标志，您会收到如下错误。

'index.ts' cannot be compiled under '--isolatedModules' because it is considered a global script file. Add an import, export, or an empty 'export {}' statement to make it a module.

如上面的错误所述，解决问题的最简单方法是不添加任何不必要的 import声明和/或 export语句，最简单的是 export一个空对象( {} )，就像这样。

export {};

综上所述，空对象 export在 JavaScript(或 TypeScript，没有 --isolatedModules 标志)中不会做任何事情。但是，当使用 --isolatedModules 运行时，它会派上用场。旗帜。
Google Maps JavaScript API 示例可能已经为这种情况做好了准备，以防有人复制并粘贴代码，这样他们就不会收到错误。