Подтвердить что ты не робот

Загрузка шаблонов усов с помощью Webpack

В настоящее время мы с моей командой переносим довольно большой проект из AMD + RequireJS в CommonJS + Webpack. Нам нравятся инструменты, которые Webpack предоставляет и думает, что CommonJS - это направление, в котором движется сообщество: прыгать на победившей стороне, которую вы могли бы сказать.

Каков эффективный способ использования webpack для автоматической загрузки и компоновки наших файлов шаблонов .mustache? В настоящее время у нас есть часы script, который использует xport для объединения всех файлов .mustache в нашу папку проекта в один файл js в формате:

var files = {};
files['path/to/file'] = '<div>{{content}}</div>';
files['path/to/other/file'] = '<span>{{stuff}}</span>';
...

Мы могли бы полностью использовать это... Что особенно удобно в нашем текущем решении, так это то, что нам не нужно специально ссылаться на наши шаблоны в проекте, когда мы создаем новый шаблон.. Поскольку script просто просматривает эту папку, словарь получает и мы можем использовать другую библиотеку, чтобы взять строку и сделать ее пригодной для использования функцией шаблона.

Какова цель? Мне любопытно, есть ли способ перейти от шаблонов в нашей папке → функции, которые мы можем использовать в коде, не требуя в них конкретных файлов. И наше текущее решение выходит за пределы webpack (если, конечно, нет способа подключиться), что раздражает, потому что мы не хотим использовать 2 скрипта просмотра. Я просмотрел loaders, но они кажутся от 1 до 1 исходным файлом → выходным файлом против многих до 1, что отличает наше текущее решение.

Спасибо!

4b9b3361

Ответ 1

Я думаю, вы могли бы построить что-то, соответствующее вашим потребностям, поверх require.context. Укажите это в свой каталог шаблонов, и он предоставит вам API для доступа к шаблонам внутри. Вы можете комбинировать этот подход с mustache-loader.