Description
I have these 2 files, products.ejs, and products.json. The template should render the list of products on a grid and output a static html with all products.
products-red.json
[
{
"name": "product 1",
"value": "red"
}
]products.ejs
<h1><%= products[0].name %></h1>This would eventually be a for that displays all products, but this is just an example.
I was trying to read the JSON in my webpack index file, and loading it into eJS for each file. I could probably pass the data in the loader options in webpack.config.js, but I want different data for each template (image product categories).
This currently does not work:
index.js (webpack entry)
var products-red = require(./data/products-red.json)
require('index.ejs?products=products-red')
EJS files don't let me require the json file between <% %>, which would have been another option. Is there any way to accomplish this with esl-html-loader?
Maybe I could convert the JSON file to a string, load it as an option, and then convert it to object inside the ejs template. But is there any simpler option?