如何在 EJS 文件中获取 JSON 内容 [WEBPACK]

【问题标题】：How to get JSON content in EJS file [WEBPACK]如何在 EJS 文件中获取 JSON 内容 [WEBPACK]
【发布时间】：2020-03-08 08:20:03
【问题描述】：

我想从外部 JSON 文件中获取值，并在我的 EJS 文件中使用这些值，该文件由 webpack 编译为 HTML。

我的 JSON 和 EJS 工作正常。

我在我的 EJS 中尝试这样的事情：

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

但我在渲染时得到的唯一输出（在 HTML 文件中）是：

"components/products.json"

我尝试使用 Fetch，但在捆绑时 Webpack 无法识别它。并且还尝试将其传递给变量但结果相同。

目标是显示图像的 URL 包含在 JSON 要求它们作为图像的 src 在EJS 文件。

【问题讨论】：

【解决方案1】：

最后，我找到了合适的解决方案。对于将来会来这里的人：

一切都发生在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 %>

【讨论】：