寻求可编译为静态文件的模板/组件引擎，支持组件复用与现代化工具

针对你的小型静态站点需求（组件复用、避免SSR/SPA框架冗余、支持Webpack和热重载），以下几个工具完全适配：

1. Nunjucks + Webpack #

• 组件复用：支持模板继承、include/import语法，能把页眉、页脚这类公共片段拆成独立文件，在各个页面模板中直接引用，实现统一维护。
• 现代化工具适配：通过nunjucks-loader无缝接入Webpack，搭配webpack-dev-server就能开启热重载，修改模板后页面实时刷新。
• 优势：纯模板渲染工具，没有多余的框架特性，打包输出纯静态HTML，体积极小，完全满足小型站点需求。

2. Handlebars + Webpack #

• 组件复用：基于Partials机制，把公共UI（比如导航、页脚）做成独立的Partial文件，在页面模板中一键导入复用。
• 现代化工具适配：用handlebars-loader集成Webpack，配合热重载插件即可实现开发时的实时更新，构建流程简单可控。
• 优势：语法简洁直观，学习成本低，生态成熟，适合快速搭建小型静态站点。

3. Eleventy (11ty) #

• 组件复用：原生支持模板继承、组件片段复用，默认兼容多种模板语言（Nunjucks、Handlebars等），不用额外配置就能统一管理公共元素。
• 现代化工具适配：自带开发服务器，启动eleventy --serve就开启热重载；也能通过插件集成Webpack，自定义构建流程。
• 优势：零配置起步，极度轻量化，输出纯静态文件，没有任何框架运行时代码，完全规避了SSR/SPA的冗余问题。

4. Pug + Webpack #

• 组件复用：通过混入（Mixins）功能把重复UI封装成可调用的片段，同时支持模板继承，轻松实现页眉、页脚的复用。
• 现代化工具适配：通过pug-loader接入Webpack，配合Webpack的热模块替换（HMR）实现热重载，开发体验流畅。
• 优势：缩进式语法简洁高效，编写模板速度快，打包后生成纯净HTML，没有多余代码。

内容的提问来源于stack exchange，提问作者ewmw