TS + VSCode Import/Export

VSCode 1.38.0 TypeScript 3.6.3

Test drive the import/export space of TS and VSCode workflow support.

• Cases
  • Import of default export
    • Result
    • Example
  • Import of generically named export
    • Result
    • Example
  • Import of something that is both a named & default export
    • Result
    • Example
  • Import of named export from module including default export
    • Result
    • Example
• Links
  • Namespaced Auto-Import
  • Other

Cases

Import of default export

Result

As expected. The identifier nameused matches how the variable was defined in the source module. Example below makes this clear.

Example

Import of generically named export

Result

Multiple auto-import hints. User can differentiate by going over each option and seeing the from differences. Does not import qualified. As a user, working with generic names intended to work by namespace, this is probable not what you want. Namespaced auto-import is an open issue on TS repo.

Example

What the user probably actually wanted. Namespaced auto-import is an open issue on TS repo

Import of something that is both a named & default export

Result

VSCode presents two auto-complete hints. Selecting either produces same result: Import of the default export. Default export seems to shadow named one. Two hint given suggets VSCode is aware of the duality, but fumbles thereafter.

Slightly buggy. Presumably non-issue in near future. OK if named import is not common case.

Example

Import of named export from module including default export

Result

As expected.

Example

Links

Namespaced Auto-Import

• Namespaced Auto-Import 1

• Namespaced Auto-Import 2

Other

• Sebastian Markbåge has stated (cannot find tweet link) that default exports were probably a language mistake, driven mostly by wide spread use of the pattern in Node/CommonJS]

• (Living Document) Basarat Against Defaults

• (2019) Nicholas C. Zakas Against Defaults (long detailed article)

  There is a factual mistake in this article:

  This type of functionality isn’t possible when using default exports because there is no canonical name for things you want to import.

  It is, as we saw above.