GitHub Pages项目中如何统一管理HTML版本号实现多处复用？

当然可以！针对GitHub Pages的静态HTML项目，有两种简单的方案能让你只维护一处版本号，避免重复修改：

方案1：用GitHub Pages自带的Jekyll（推荐） #

GitHub Pages默认支持Jekyll静态站点生成，可以通过配置文件定义全局变量：

1. 在项目根目录创建_config.yml文件，添加版本号：

version: "1.0.3"

2. 在HTML文件里直接引用这个变量：

• 页脚显示版本：

<footer>Version {{ site.version }}</footer>

• 脚本引用带版本号：

<script type="text/javascript" src="scripts/script_1.js?v={{ site.version }}"></script>
<script type="text/javascript" src="script_2.js?v={{ site.version }}"></script>

之后每次更新版本，只需要修改_config.yml里的version值，GitHub Pages会自动编译生成包含最新版本号的页面。

方案2：纯JavaScript动态处理（无需依赖工具） #

如果不想用Jekyll，可以用JS动态注入版本号：

1. 在HTML的<head>里定义版本变量，然后动态修改页脚和脚本：

<script>
  const APP_VERSION = "1.0.3";

  // 页面加载完成后更新页脚
  document.addEventListener('DOMContentLoaded', () => {
    // 更新页脚版本
    const footerEl = document.getElementById('footer-version');
    if (footerEl) footerEl.textContent = `Version ${APP_VERSION}`;

    // 动态加载脚本并添加版本参数
    const scriptUrls = [
      'scripts/script_1.js',
      'script_2.js'
    ];

    scriptUrls.forEach(url => {
      const script = document.createElement('script');
      script.type = 'text/javascript';
      script.src = `${url}?v=${APP_VERSION}`;
      document.body.appendChild(script);
    });
  });
</script>

2. 页脚留一个占位元素：

<footer>
  <span id="footer-version"></span>
</footer>

注意：这种方式脚本是动态加载的，如果你的脚本有依赖顺序，要调整scriptUrls的顺序，或者给脚本添加async/defer属性控制加载时机。

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