Блог

Кажется, я не могу найти ответ на свой вопрос о том, должен ли я включать файлы в <script> тег при использовании модулей ES6 или браузер будет запрашивать их автоматически? Если да, то как он разрешает путь?

В комментарии вы сказали:

Я знаю, что поддержки пока нет. Мой вопрос о том, как он будет вести себя при реализации

Когда мы впервые опубликовали этот вопрос и ответ, их не было, но сейчас они есть. И это соответствует тому, что я ранее описал, было предварительно указано: вы используете type="module" :

 <script src="mod.js" type="module"></script>
  

Вы делаете это только для точки входа, а не для модулей, на которые ссылается точка входа import (подробнее ниже).

Из спецификации WHAT-WG:

Атрибут type позволяет настраивать тип представленного скрипта:

• …
• Установка атрибута на совпадение без учета регистра ASCII для строки «module» означает, что скрипт является скриптом модуля, который должен интерпретироваться в соответствии с производством верхнего уровня модуля JavaScript. …
• …

…

Классические скрипты и скрипты модулей могут быть либо встроены в строку, либо могут быть импортированы из внешнего файла с использованием src атрибута, который, если он указан, указывает URL внешнего ресурса скрипта для использования.

Зависимости модулей будут разрешены и автоматически извлечены, вы не перечисляете их в их собственных script тегах. Просто точка входа.

Обратите внимание, что вы можете обслуживать модули в браузерах с поддержкой модулей, а также передавать транспилированные пакеты в браузеры без поддержки модулей, используя nomodule атрибут:

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

И поскольку любой браузер, поддерживающий модули, поддерживает функции ES2015, по крайней мере (возможно, и больше), это означает, что вы можете использовать собственные class функции и функции со стрелками и такой код в модулях, а также транспилированный код в немодульных пакетах, так что вы получаете собственную производительность от собственных движков.

Позже в спецификации говорится:

Чтобы разрешить спецификатор модуля, заданный базовым URL-адресом URL и спецификатором строки JavaScript, выполните следующие действия. Он вернет либо запись URL-адреса, либо сбой.

• Примените анализатор URL к спецификатору. Если результат не является ошибкой, верните результат.
• Если спецификатор не начинается с символа U 002F SOLIDUS (/), двухсимвольная последовательность U 002E ПОЛНАЯ ОСТАНОВКА, U 002F SOLIDUS (./) или трехсимвольная последовательность U 002E ПОЛНАЯ ОСТАНОВКА, U 002E ПОЛНАЯ ОСТАНОВКА, U 002F SOLIDUS (../), ошибка возврата.

ПРИМЕЧАНИЕ: Это ограничение действует для того, чтобы в будущем мы могли разрешить загрузчикам пользовательских модулей придавать особое значение «голым» спецификаторам импорта, таким как import "jquery" или import "web/crypto" . На данный момент любой такой импорт завершится неудачей, вместо того чтобы рассматриваться как относительные URL-адреса.

Итак, если модуль является одноранговым узлом загружающего его файла, запустите спецификатор модуля с ./ помощью ( src="./myfile.js" или import ... from "./myfile.js" ). Простые спецификаторы модулей без пути вообще зарезервированы для карт импорта (если они когда-либо поддерживаются без пометок в браузерах, отличных от браузеров на основе Chromium).