Skip to content
Advertisement

What is the meaning of empty export {} in vanilla javascript/HTML

In the Google Maps Javascript API example, I see they had something like this in the HTML:

JavaScript

and an empty export statement at the end of the TS/JS scripts.

JavaScript

I don’t see any examples or mentioning of empty exports on MDN, so I was wondering if anyone knew how it works. How does the script know to run it if the export is empty.

Advertisement

Answer

This looks like something in TypeScript; it has nothing to do with JavaScript.


If either of the cases below occurs, then you will need an import/export in the file.

  1. The TypeScript file is being called with the flag below.

    JavaScript
  2. The tsconfig.json file has the following key and value.

    JavaScript

According to typescriptlang.org, it states:

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.

If you try to run the TypeScript file with the --isolatedModules flag, you get an error like below.

JavaScript

As the error states above, the simplest way to fix the issue without adding any unnecessary import statements and/or export statements, it is easiest to export an empty object ({}), like so.

JavaScript

In summary, the empty object export will not do anything in JavaScript (or TypeScript, without the --isolatedModules flag). However, it comes in handy when running with the --isolatedModules flag.

The Google Maps JavaScript API example might be getting ready for this scenario, in case someone copied-and-pasted the code, so that they wouldn’t get an error.

User contributions licensed under: CC BY-SA
3 People found this is helpful
Advertisement