Набор файлов в Vite

Набор файлов читают через import.meta.glob, и импорт перечисляет совпавшие модули.

Пусть в папке src/lines лежат два коротких модуля с одним экспортом. Сначала первый файл:

export const line = 'hello a';

Второй файл устроен так же:

export const line = 'hello b';

Маска ./lines/*.js опишет оба пути. Пройдём по ключам объекта и загрузим каждый модуль:

const modules = import.meta.glob('./lines/*.js');
const root = document.createElement('div');

for (const path in modules) {
  modules[path]().then((mod) => {
    const p = document.createElement('p');
    p.textContent = mod.line;
    root.append(p);
  });
}

document.body.append(root);

На сервере разработки каждый файл из папки приходит отдельным запросом после вызова функции из объекта. Откроем http://localhost:5173 и увидим две строки с словом hello. Добавление нового файла под ту же маску не требует править список импортов вручную.

Создайте папку src/chunks с двумя модулями, где в экспорте есть слово ready, и выведите обе строки через import.meta.glob с маской ./chunks/*.js.

Добавьте третий файл в src/chunks, перезагрузите страницу и убедитесь, что новая строка появилась без нового статического импорта в src/main.js.