Webpack、jinja 模板和静态路径

Question

如何将 webpack loader/semi-filter 集成到 jinja 模板中？我想将 jinja 模板转换为 jinja 模板，但静态路径根据 webpack 配置替换为输出路径。基本上是 PUG-loader 的 require()，但对于 jinja.

假设过滤器查询看起来像这样：src="{{ 'path' | webpack }}"，但它不是真正的神社过滤器，因为在构建时它会被替换为 src='outputPath'。我应该从哪里开始看？ HTMLWebpack插件？ HTML-装载机？我查看的其他 jinja/flask/webpack 相关项目倾向于更多而不是更少地将 webpack 绑定到 Flask 服务器，这不适合我的情况。

Answer 1

据我了解，您正在尝试将静态文件放入 jinja 模板中，但是 webpack 为您制作的所有内容包括文件名中的哈希值，我只知道一个解决方案：

你应该像这样在你的模板中注入 htmlWebpackPlugin 脚本：

new htmlWebpackPlugin(
    template: 'your/template/path',
    inject: false
)

然后在你的模板中使用webpack的模板自动注入脚本：

...
<script defer src = <%= `"{{url_for('static', filename ='${(htmlWebpackPlugin.js}).toString().split('/').pop()}')}}"` %>

此方法只是将一些js代码插入到模板中，它会为您执行此类注入，如果您想要更多静态文件，只需使用相同的方法但使用另一个js代码

Webpack、jinja 模板和静态路径

Webpack, jinja templates and static paths

html

flask

webpack

jinja2

assets