Почему не вызывается функция с export и без него если в теге script указан type="module"?

Question

[Сергей Золотарёв]

Знаю о том, что в теге script имеется значение аттрибута type под названием "module" - оно отвечает за подключение файлов скриптов, где имеются оператор import и прочие прелести последних версии JavaScript.

В файле скрипта, по которому я задаю вопрос, указаны:

1. Конструкция import для подключения файла одной библиотеки;
   
2. Несколько функции с наличием export
   

В файле, который отвечает за логику фронтенда одной страницы эти функции прописал и они должны вызываться при реакции DOM на пользовательские события. Когда начинаю тестировать и компилятор ругается:

Uncaught ReferenceError: dynamicTooltip is not defined
    at postCurrentActivity (feed.js:342:13)
    at HTMLAnchorElement.<anonymous> (feed.js:70:17)
    at HTMLAnchorElement.dispatch (jquery.js:2:41772)
    at y.handle (jquery.js:2:39791)

Но файл с функциями выступает в качестве модуля и указаны экспорты в функциях. А браузер не хочет с ними дружить!!! Что здесь не так? Как правильно вызвать экспортные функции из script type="module"?

Эта же проблема касалась ещё модулей с функциями без export...

Comments

[Lynn «Кофеман»]

Приведите код, в том числе html

[Сергей Золотарёв]

Lynn «Кофеман», перед вами ссылки на примеры проблемного кода:

• Скрипт с проблемными функциями
  
• Логика фронтенда проблемной страницы
  
• HTML-код проблемной страницы
  

[Lynn «Кофеман»]

export и модулей не попадает в глобальную область видимости.
Вам надо в вашем скрипте import-ировать нужные функции.

[ArtLash]

А можно весь код посмотреть ?
Ошибка указывает на то, что функция dynamicTooltip не определена в момент вызова в коде.

Answer 1

[Дмитрий Перевозкин]

Добрый день, тут все просто, для работы import/export нужен сервер, например live server vs code расширение,
Или же Xamp/OpenServer, это одно из условий, в package.json если у вас он есть так же нужно указать

{
  "type": "module"
}

но в целом, достаточно иметь какой-нибудь сервер, на которым запущено приложение, и type="module" на script(что собственно вы и сделали)

Возможно у вас все это есть и я не так понял вопрос, обычно когда все условия выполнены, import/export работает без нареканий, может покажете больше кода

Проверьте описанные мною условия и попробуйте снова.

Comments

[Сергей Золотарёв]

У меня чисто локальный LEMP в Docker и пробовал в package.json указать параметр по модулям. Браузер одну и ту же песню играет.

Примеры кода:

• Скрипт с проблемными функциями
  
• Логика фронтенда проблемной страницы
  
• HTML-код проблемной страницы
  

[Дмитрий Перевозкин]

Может не так понял, а разве не нужно ее импортировать что-то вроде
import {dynamicTooltip} from '[source]'

или она должны быть глобальной?

[Сергей Золотарёв]

Дмитрий Перевозкин, она должна быть глобальной. А если в логике фронта страницы указать import, то нужно ли тот же type="module"(подобное я пробовал и не помогло) указывать в теге

[Дмитрий Перевозкин]

Сергей Золотарёв, Ну нет, глобальной она не будет, есть файл с функциями

условно:
lib_file:
export function dynamicTooltip() ...

[файл js где вы хотите использовать dynamicTooltip]
import {dynamicTooltip} from '[lib_file]'

это примерно, но если что-то export'ируется то обязательно импортируется в другом модуле

[Сергей Золотарёв]

Дмитрий Перевозкин, спасибо! Сработало!!!

[Дмитрий Перевозкин]

Сергей Золотарёв, Отлично!