Плагин Webpack для прикрепления статического объекта JSON к выходу

Question

Я пытаюсь написать плагин webpack, который войдет в каталог, содержащий html-файлы, откроет каждый, удалит новые строки и сгенерирует объект для присоединения как статическое свойство к моему выводу файл (который является var).

Объект будет выглядеть примерно так:

{ 
    htmlFile1: '<p>some html one!</p>', 
    htmlFile2: '<span>some html two!</span> 
} 

Тогда я хотел бы, чтобы прикрепить к моему выходу, как:

App.templates = { .... } 

Создание объекта делается. Я просто борюсь с webpack и выясняю, как прикрепить его к основному объекту. Должен ли я просто записать его на диск и потребовать? Или есть способ добавить его в пакет через плагин?

Я использую Rivets.js в качестве механизма шаблонов, и я не смог найти что-то там, что уже делает что-то подобное.

Также стоит отметить, что все, что я использую, это webpack и npm. Нет Grunt/Gulp/etc

Большое спасибо! Mike

Answer 1

Вы можете использовать WebPack-х require.context импортировать все HTML файлы в каталоге в виде текста, обрабатывают текст и экспортировать результаты в виде одного объекта:

const requireTemplate = require.context('./templates', false, /\.html$/); 

module.exports = requireTemplate.keys().reduce((templateMap, templatePath) => { 
    const templateName = templatePath.match(/\/(\w*?)\.html/)[1]; // get filename without path and extention 
    templateMap[templateName] = require(templatePath); 
    return templateMap; 
}, {});