H2E Studio 入门：将本地 HTML 项目生成 EXE

用 H2E Studio 将本地 HTML 项目生成 Windows EXE

这篇入门说明以一个只有单个页面的本地项目为例。你会先预览页面，再构建 EXE，最后运行生成的程序检查结果。适用环境为 Windows 10 或 Windows 11，电脑需要安装 Microsoft Edge WebView2 Runtime。

1. 准备一个独立的网页目录

在电脑上新建一个文件夹，例如 D:\H2E-Demo。用记事本创建 index.html，保存到该文件夹，文件内容如下。保存时选择 UTF-8 编码，并确认文件名不是 index.html.txt。

<!doctype html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>我的第一个 H2E 程序</title>
</head>
<body>
  <h1>我的第一个 H2E 程序</h1>
  <p>这个页面来自本地 index.html。</p>
  <button onclick="document.getElementById('result').textContent='按钮正常工作'">点我测试</button>
  <p id="result"></p>
</body>
</html>

先在浏览器中打开 index.html，确认标题和按钮都能显示。请把 H2E Studio 程序放在网页目录之外，不要放进 D:\H2E-Demo 或其子目录。

2. 在 H2E Studio 中设置入口

1. 打开 H2E Studio，新建一个项目。
2. 进入「基础参数」的「入口设置」，选择「WEB 文件」，指定刚才保存的 D:\H2E-Demo\index.html。本例不使用「WEB 网址」。
3. 在「程序名称」中填写打包结果的 EXE 名称，例如 H2E-Demo。其余窗口参数先保留默认值。
4. 保存项目，方便以后修改或重新构建。

3. 先预览，再构建

点击工具栏的「预览」，确认页面中的文字显示正常，并点击按钮检查交互。若预览不对，先检查入口文件和网页自身的相对路径。预览用于检查页面，不等同于已经生成 EXE。

确认预览结果后，点击「构建（打包）」。如果出现正式打包确认，请先阅读提示再选择：正式打包可能使用授权额度；免费版打包的输出行为和限制以程序当前提示为准。不要为了测试反复执行正式打包。

构建窗口显示成功后，使用「打开程序目录」找到输出文件，运行生成的 EXE，再次检查页面文字和按钮。只有输出文件成功运行，才算完成本次入门练习。

常见问题

• 找不到入口文件：确认选择的是实际的 index.html，并在 Windows 资源管理器中开启文件扩展名显示，排除 .txt 后缀。
• 预览或运行时页面空白：先直接用浏览器打开入口文件；若项目还有 CSS、JavaScript 或图片，检查引用路径是否相对于入口文件正确，相关文件是否仍在项目目录内。
• 提示 WebView2 Runtime：按程序提示安装或更新 Microsoft Edge WebView2 Runtime，再重新预览和运行。
• 本地页面能运行，联网功能不能用：本地 HTML 可以离线使用；网页调用远程 API、在线图片或外部网站时，相关功能仍需网络。

这个示例只覆盖本地网页的最基本流程。机器码授权、在线升级、安装包制作和大型项目打包需要另外配置，不属于本篇步骤。需要下载工具或查看适用系统时，请访问 H2E Studio 产品页。