时间戳

首页 > 解决方案 > 在没有客户端框架的情况下使用 Webpack 和 Express.js 时如何要求资产？

node.js - 在没有客户端框架的情况下使用 Webpack 和 Express.js 时如何要求资产？

问题描述

我正在编写一个没有任何客户端框架（如 React、Vue 或 Angular）的标准 express.js 应用程序。HTML 模板像这样从服务器呈现：

app.get('/', function (req, res) {
  res.render('index') // template engine ejs
})

app.get('/about', function (req, res) {
  res.render('about') // template engine ejs
})

我正在使用 Webpack 构建我的静态资产，例如 javascript 文件、css 文件和图像。

问题：如果资产文件的名称中包含哈希码，我如何在我的 HTML 模板中使用资产。例如sample.a23ijafj.jpg.

由于在文件被编辑时哈希码总是会改变我不能只使用生成的文件名：

<img src="sample.a23ijafj.jpg" />

标签： node.jsexpresswebpackwebpack-4

解决方案

尝试使用这个 Webpack 插件： https ://www.npmjs.com/package/html-webpack-plugin

有了这个，您可以创建 HTML 模板以与您的其他资源一起生成。我自己并没有真正使用过它，但它似乎有足够的文档来解决你的问题。

推荐阅读