Разница между ES2015 `import * as` vs просто« import »

Question

Я только что исправил ошибку, изменив import * as CodeMirror на простое import CodeMirror.

• Я скопировал this code. (Портирование его из TypeScript)
• import * as CodeMirror работал, пока аддон не был импортирован для его побочных эффектов: ожидаемое новое свойство fold не определено.

Вопросы: (Я пытаюсь понять, что произошло лучше)

• Что происходит? Как это изменение исправить ошибку?
• Кто добавляет свойство default в CodeMirror? (Или более вероятно: обертывание модуль внутри другого объекта, который выглядит очень похоже) Наиболее вероятными подозреваемыми:
  • JavaScript модули (ES2015)
  • Бабель
  • Webpack
  • CoffeeScript
  • CodeMirror
• Есть ли лучший способ достичь того, чего я пытался достичь?

---

Подробнее:

Этот код не работает, как ожидалось:

import * as CodeMirror from 'codemirror' 
import 'codemirror/addon/fold/indent-fold.js' # should add `fold` object to `CodeMirror` 

console.log typeof CodeMirror   ## 'object' 
console.log typeof CodeMirror.fold  ## 'undefined' 
console.log typeof CodeMirror.default ## 'function' 

## Work-around: 
console.log typeof CodeMirror.default.fold ## 'object' 

Этот код работает, как ожидалось:

import CodeMirror from 'codemirror' 
import 'codemirror/addon/fold/indent-fold.js' # should add `fold` object to `CodeMirror` 

console.log typeof CodeMirror   ## 'function' 
console.log typeof CodeMirror.fold  ## 'object' 
console.log typeof CodeMirror.default ## 'undefined' 

---

я уже изучал эти ресурсы, но они не помогли мне в полной мере понять, что случилось:

• JS import reference
• JS export reference
• CoffeeScript modules

Answer 1

import * as CodeMirror from 'codemirror' импортирует все названный экспорт и namespaces их в объект с именем CodeMirror.

import CodeMirror from 'codemirror' импортирует экспорт по умолчанию.

Answer 2

Давайте предположим, что у вас есть очень простой модуль под названием «тест-модуль», в нем у вас есть:

var test = 'test'; 
export default test; 
export function helloWorld() { ... }; 

Когда вы делаете:

import something from 'test-module'; 

вы только импорта экспорта по умолчанию 'некоторые-модуль. В этом случае это строковый тест. экспорта по умолчанию может быть что угодно, объект, функции и т.д.

Когда вы делаете:

импорт {HelloWorld} из 'тест-модуля';

Вы специально импортируете член «тестового модуля» с именем «helloWorld», а не экспорт по умолчанию. В этом случае это функция «helloWorld».

Если вы сделали:

import {something} from 'test-module'; 

«что-то» будет «не определено», поскольку нет экспорта для с этим именем.

import * as something from 'test-module'; 

запрашивает объект со всеми указанными экспортными данными «тестового модуля».

Тогда вы можете получить доступ к любому из экспорта в «test-module» как something.name. В этом случае они будут something.default и something.helloWorld.