Как получить содержимое JSON в файле EJS [WEBPACK]

Я хочу получить значения из внешнего файла JSON и использовать эти значения в моем файле EJS, который скомпилирован как HTML с помощью webpack.

Мои JSON и EJS работают правильно.

Я пробую такие вещи в своем EJS:

<%=
require('./components/products.json')
%>

Но единственный вывод (в файле HTML), который я получаю при рендеринге, это:

"components/products.json"

Я пытался использовать Fetch, но во время сборки Webpack его не распознал. А также пытался передать его в переменной, но тот же результат.

Цель состоит в том, чтобы отобразить URL-адрес изображения, содержащийся в JSON, требовать их в качестве src изображения в файле EJS.


webpack ejs webpack-file-loader
person PedroZorus    schedule 12.11.2019    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Наконец, я нашел правильное решение. Для будущих людей, которые придут сюда:

Все происходит в webpack.config.js

Настройка:

1) В первый раз мне нужен файл JSON:

const productsJson = require('.src/components/products.json')

2) Затем я добавляю следующий код в свой массив плагинов:

new HtmlWebpackPlugin({
    template: './src/index.ejs',
    templateParameters: {
        'myJSON': productsJSON
    }
})

3) Наконец, в index.ejs не нужно требовать файл, он уже загружен webpack.config.js. Чтобы отобразить содержимое JSON, вам просто нужно выполнить следующую строку:

<%= myJson.anything_In_My_Json %>

person PedroZorus    schedule 01.12.2019