Нужен ли мне загрузчик модулей, если я использую модули ES6?

К сожалению, мои знания о загрузчиках модулей JavaScript все еще растут, и я пытаюсь понять их связь с новым ES6 Modules. Насколько я могу судить, использование загрузчика модулей, такого как CommonJS или RequireJS с использованием ES5 совместимого JavaScript, действительно требовало использования асинхронного загрузчика модулей для повышения производительности и загрузки только по мере необходимости с использованием соответствующего синтаксиса загрузчика модулей.

Однако, глядя на ES6 документацию модуля и читая другую информацию, мне кажется, что загрузка модуля изначально поддерживается с помощью ключевых слов import и export. Если это так, правильно ли я понимаю, что ES6 JS modules изначально поддерживает асинхронную загрузку модулей, и поэтому мне не нужно использовать дополнительный инструмент, такой как CommonJS или RequireJS?


person atconway    schedule 28.10.2016    source источник
comment
Будьте осторожны со словом нативный — в каком контексте? Операторы import/export пока официально не поддерживаются в браузерах/узлах и т. д., но поддерживаются транспиляторами, такими как Babel (developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/)   -  person Nick Zuber    schedule 28.10.2016
comment
@Supersharp За флагом, верно? Спецификация загрузки модуля браузера не завершена, поэтому я был бы удивлен, если бы это была основная ветка.   -  person CodingIntrigue    schedule 28.10.2016


Ответы (3)


мне кажется, что загрузка модуля изначально поддерживается с помощью ключевых слов импорта и экспорта.

Не совсем. Объявления import и export определяют только зависимости и интерфейс каждого модуля. Они позволяют статически извлекать строки, которые называют нужные модули, и ничего больше.

Если это так, не нужно ли мне использовать дополнительный инструмент, такой как CommonJS или RequireJS?

Нет. Вам все еще нужно использовать загрузчик для модулей ES6, который разрешает имена или пути или что-то еще из imports в фактические файлы модулей и загружает их с помощью метода, зависящего от реализации.

Доступно множество инструментов или цепочек инструментов, примеры различных решений:

  • webpack: объединяет все в один большой скрипт
  • System.js: загружает отдельные модули динамически и асинхронно (аналогично тому, что делает require.js)
  • родной: node.js и веб-браузеры все еще выясняют, как поддерживать загрузку модулей без дополнительных библиотек
  • транспиляция babel: вы можете конвертировать модули ES6 в формат AMD или CommonJS и использовать для них известные инструменты, такие как require.js
person Bergi    schedule 28.10.2016
comment
Просто чтобы завершить цикл, насколько я понимаю, если бы я не использовал динамический загрузчик модулей, подобный приведенным выше, это означало бы, что я буду подчиняться старому школьному способу ссылки на каждый отдельный файл модуля .js. нужно в моем файле index.html (или, может быть, в одном файле, если я объединил и минимизировал)? - person atconway; 28.10.2016
comment
@atconway На самом деле включение старой школы <script> вообще не работает с модулями (пока), оно попытается проанализировать их как сценарии старой школы, что потерпит неудачу. Вам необходимо объединить модули в один сценарий. - person Bergi; 29.10.2016
comment
Я должен был уточнить - не на отдельные модули в тегах <script>, а скорее на транспилированные файлы .js ES5 (я использую TypeScript) нужно было бы ссылаться по отдельности, или версия в комплекте верна? - person atconway; 31.10.2016
comment
Модули IIRC, ES5 означают синтаксис commonjs, поэтому отдельные ссылки на них не будут работать. Либо объедините их, либо используйте загрузчик commonjs, например require.js. - person Bergi; 31.10.2016

Насколько я понимаю, ES6 поддерживает синтаксис для определения и импорта модулей. Фактическое действие по импорту необходимых модулей является работой инфраструктуры.

В современных браузерах (по состоянию на 2016 год) нет встроенных функций для поддержки загрузки модулей, и поэтому вам все равно понадобится что-то вроде SystemJS для фактической загрузки.

person Robba    schedule 28.10.2016
comment
Ожидается ли, что браузеры будут поддерживать загрузку модулей? - person Chris Nevill; 27.02.2018

Файлы JavaScript ES6 по своей сути рассматриваются как модуль. если вы определите что-либо в файле .js, это будет видно только в этом файле (локальная область). Что делает экспорт, он выставляет классы/переменные, определенные как экспорт, видимые снаружи. затем вы можете импортировать его в другой модуль. Существуют и другие способы определения модулей, такие как использование Commonjs или AMD и т. д. Загрузчики модулей необходимы, если вы хотите динамически откладывать загрузку модулей. бывший. Systemjs является таким загрузчиком динамических модулей. он будет динамически извлекать файл физического модуля с сервера, когда он запрашивается, и предотвратит многократную загрузку одного и того же файла. в приложении SPA в прошлом приходилось загружать все в начале, чтобы оно работало. с динамическими загрузчиками модулей теперь у нас могут быть только те файлы, которые нам нужны для выполнения намеченной работы. Надеюсь, что это поможет вам.

https://github.com/systemjs/systemjs

person Shivanka    schedule 28.10.2016