HTML多语言输出核心是用多个HtmlWebpackPlugin实例生成独立HTML文件（如index.zh.html、index.en.html），通过templateParameters注入各语言文案，配合EJS模板渲染，确保SEO友好、无闪烁、CDN缓存干净。
HTML 文件国际化不是“加个 lang 属性就完事”，而是要让文本可替换、路径可适配、构建可复用。自动化打包维护配置的关键，是把语言维度从 HTML 内容里抽出来，再和构建流程对齐——否则每次改语言就得手动复制文件、改路径、修 script 标签。
怎么用 html-webpack-plugin 做多语言输出
核心是让每个语言生成独立的 HTML 文件，而不是靠 JS 动态切换。这样 SEO 友好、首屏无闪烁、CDN 缓存也干净。
- 每个语言对应一个
HtmlWebpackPlugin实例，filename设为index.zh.html、index.en.html等 -
templateParameters传入该语言的文案对象，比如{ title: '我的应用', submit: '提交' } - 模板里用
（EJS）或渲染，别硬编码文本 - 注意：Webpack 5+ 默认不启用 EJS，需安装
html-webpack-plugin并确保模板后缀是.ejs或显式配置loader - 如果用了
clean-webpack-plugin，它会清空整个dist目录，多语言文件不会互相覆盖，但得确认你没误删其他静态资源
Vite 构建时 HTML 路径不更新？检查 base 和入口约定
Vite 不重写 index.html 里的 src 属性，它只靠插件注入最终产出的 chunk 路径。路径出错，90% 是约定没对齐。
Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
下载
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
-
index.html必须放在项目根目录，Vite 才认它为入口模板 -
<script src="./main.js"></script>必须用相对路径（./开头），不能写/src/main.js或src/main.js -
build.base配置必须和部署路径一致：根域名部署设base: './'，子路径如/app/就设base: '/app/' - 构建后检查
dist/index.zh.html里的<script></script>标签是否已变成类似<script type="module" src="/assets/index-abc123.js"></script>—— 没变就是上面某条没满足 - 不要在
index.html里写<script src="/public/app.js"></script>，这绕过构建，没法哈希、无法压缩、环境变量也不生效
data-i18n 标记怎么用才不翻车
这是轻量级客户端方案的核心，但标记漏了、属性写错、lang 同步缺失，都会导致部分文案不更新或读音错误。
立即学习“前端免费学习笔记（深入）”；
- 所有要翻译的元素必须显式加
data-i18n，值是语言包里的键名，比如<h1 data-i18n="header_title"></h1> -
placeholder、title、alt这些属性得用带后缀的写法：data-i18n-placeholder、data-i18n-title - 切换语言后，必须同步更新
document.documentElement.lang（如'zh-Hans'），还要遍历所有带lang的子元素单独设值——浏览器不继承根节点的lang - 语言包 JSON 必须扁平结构，
locales/zh.json和locales/en.json键名完全一致；缺翻译项留空字符串，别直接删 key，否则 JS 查不到就留白 - 别在
<style></style>、<script></script>、<pre class="brush:php;toolbar:false;"></pre>里加data-i18n，这些节点不渲染为可见文本，加了无效
最易被忽略的是：语言包加载失败时没 fallback，或者 document.documentElement.lang 和实际渲染语言不一致，导致屏幕阅读器读错、字体回退失效、标点间距异常。国际化不是加功能，是改习惯——所有文案必须走键名，所有路径必须守约定，所有 lang 属性必须手动同步。
