GitHub Pages部署的Jekyll站点与本地运行样式不一致问题求助

解决方案步骤 #

1. 修正baseurl配置
   打开站点根目录的_config.yml文件，找到baseurl配置项，修改为你的GitHub Pages子路径：baseurl: "/WUA"，本地预览时执行jekyll serve --baseurl ''即可正常访问，线上部署时会自动带上子路径前缀，避免CSS、JS等静态资源加载失败。
2. 对齐本地与GitHub Pages的运行环境
   本地安装github-pages官方依赖包，确保本地编译环境和线上完全一致：
   • 在项目的Gemfile中添加以下内容：

   source 'https://rubygems.org'
   gem 'github-pages', group: :jekyll_plugins
   

   • 执行bundle install安装依赖，后续本地预览使用bundle exec jekyll serve命令启动，确保本地编译结果和线上完全一致。
3. 修正静态资源引用路径
   检查所有模板中CSS、JS、图片的引用代码，不要直接写根路径格式的/css/style.css，统一添加site.baseurl前缀，示例如下：

   <link rel="stylesheet" href="{{ site.baseurl }}/assets/css/main.css">
   

4. 检查主题配置
   如果使用第三方主题，确认你已经正确配置主题参数：
   • 如果是通过remote_theme方式引用主题，确认_config.yml中remote_theme的作者和主题名拼写完全正确
   • 如果是本地安装的主题，确认所有主题必要的模板文件、资源文件都已经推送到远程仓库，没有被.gitignore忽略
5. 排查构建报错
   进入仓库的Settings > Pages页面，查看GitHub Pages的构建日志，确认是否有配置语法错误、依赖缺失等构建失败问题，根据报错信息修正对应配置。

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