21

I started using es2015 with babel in last project. When I try to do import or export inside if condition, I have an error 'import' and 'export' may only appear at the top level. I see a lot of cases for that and it works good with require, but not with es2015 modules. Is there any reason for this limitation?

Kirill Fuchs
  • 13,446
  • 4
  • 42
  • 72
Alexandr Subbotin
  • 1,714
  • 2
  • 17
  • 16
  • 2
    Because es2015 modules are synchronously loaded maybe? Allowing nested `export`s would mean that the export may be deferred until that line is called – CodingIntrigue Dec 10 '15 at 13:50
  • babel-eslint. https://stackoverflow.com/questions/39158552/ignore-eslint-error-import-and-export-may-only-appear-at-the-top-level – chetan pawar Jul 06 '17 at 23:24

1 Answers1

17

JavaScript performs static analysis on ES6 modules. This means you cannot dynamically perform imports or exports. Read section 4.2 of this article for more information:

A module's structure being static means that you can determine imports and exports at compile time (statically) – you only have to look at the source code, you don’t have to execute it.

There are many reasons for this approach, some of which are to prepare JavaScript for future features that rely on the ability for a source file to be statically analysable, namely macros and types (discussed in the aforementioned article).

Another interesting article on this topic mentions cyclic dependencies and fast lookups as reasons.

______

If you want to perform an export within some nested block of a module, reconsider how you are writing the module and exposing its APIs/internals as it is almost certainly not necessary. The same goes for if you are currently requireing modules within nested blocks in your ES5 code. Why not require / import at the top of your module and consume their APIs/internals within the nested blocks? The main advantage of this approach, at least from a readability point of view, is that you can know the dependencies of a module without having to scan its source for require calls.

sdgluck
  • 24,894
  • 8
  • 75
  • 90
  • 4
    Not only that, but they are conceptually hoisted since module dependencies are fully processed before any of your code even executes, and the concept of having an import in an `if` would require execution. – loganfsmyth Dec 10 '15 at 18:06
  • 1
    @loganfsmyth That is a much more succinct way of putting it :-) – sdgluck Dec 10 '15 at 18:10