Рабочая ситуация: импортируем в основной игровой скрипт переменную со словарём (для проекта Wordle на JavaScript). Подключаем к странице основной скрипт <script src="script.js"></script> и дальше делаем всё по правилам импорта и экспорта:
- в файле words.js, откуда будем экспортировать значение переменной, пишем команду export const WORDS = [] — она означает, что теперь мы можем использовать её содержимое в другом скрипте;
- в файле script.js, куда будем импортировать эту переменную, пишем так: import { WORDS } from "./words.js"; — так скрипт поймёт, что и откуда нам нужно взять.
Кажется, что всё верно, но при исполнении кода в браузере получаем ошибку:
SyntaxError: Unexpected token '{'. import call expects exactly one argument.
Что это значит: браузер по какой-то причине ругается на фигурную скобку — ему кажется, что вместо неё должно стоять что-то другое.
Что делать с ошибкой SyntaxError: Unexpected token '{'. import call expects exactly one argument
На самом деле мы не в каждом файле сделали всё, что нужно: у нас же ещё есть файл index.html, где мы подключаем наш основной скрипт. Раз мы эту страницу откроем в браузере, то произойдёт такое:
- Браузер будет обрабатывать файл index.html, строчку за строчкой.
- Как только он встретит команду <script src="script.js"></script>, то загрузит скрипт себе в память и тоже будет выполнять его в браузере.
Но если мы импортируем данные в скрипте, который будет работать в браузере, то должны указать дополнительный параметр type="module».
Встретив этот параметр, браузер поймёт, что вы хотите использовать модули и подключать один к другому во время работы, и не будет выдавать ошибку.
Решение: в случае ошибки SyntaxError: Unexpected token '{'. import call expects exactly one argument достаточно добавить при подключении скрипта параметр type="module":
<script src="script.js" type="module"></script>