Модуль в Vite
Модуль подключают командой import, и браузер получает отдельный файл, а не общий бандл.
Точка входа лежит в
src/main.js.
Из неё можно импортировать
другие файлы в той же папке.
Команда import
указывает путь в кавычках.
Сервер разработки отдаёт
каждый такой путь
отдельным ответом.
Сначала создадим файл
с текстом для страницы:
export const text = 'hello';
Слово export
делает константу доступной
снаружи файла.
Теперь подключим её
в главном модуле
и выведем на страницу:
import { text } from './message.js';
document.body.textContent = text;
При открытой вкладке
http://localhost:5173
на экране появится слово
hello.
В инструментах разработчика
на вкладке сети видно,
что main.js
и message.js
приходят разными запросами.
Так Vite держит структуру проекта
прозрачной во время работы.
Создайте src/message.js с экспортом строки hello и выведите её из src/main.js на страницу.
Откройте вкладку сети в браузере и убедитесь, что message.js загружается отдельным запросом от main.js.