1. 为什么选择Gitee Pages搭建个人网站作为一个技术爱好者我最初搭建个人网站时也纠结过各种方案。传统方式需要购买域名、租用服务器每年至少几百块的开销不说光是配置环境就能劝退不少新手。后来我发现Gitee Pages这个宝藏功能它完美解决了三个痛点零成本、零运维、零门槛。Gitee Pages是码云Gitee提供的静态网页托管服务最大的特点就是免费生成专属的.gitee.io二级域名。我实测上传一个HTML文件到部署完成最快只要5分钟。相比需要配置Nginx、处理SSL证书的云服务器方案它就像把文件扔进文件夹就能自动发布一样简单。适合使用Gitee Pages的场景包括个人技术博客、作品集展示、项目文档、小型活动页面等。不过要注意两个限制一是仅支持静态资源HTML/CSS/JS不能运行PHP等后端代码二是未实名认证的仓库每月有1GB流量限制但对个人展示完全够用。2. 从零开始的完整建站流程2.1 注册与仓库创建首先访问Gitee官网注册账号建议直接用手机号注册因为后续开启Pages服务需要实名认证。登录后点击右上角号选择新建仓库这里有几个关键设置仓库名称这将成为你网站域名的一部分如仓库名myblog则域名为username.gitee.io/myblog勾选使用Readme文件初始化仓库避免空仓库无法开启Pages许可证建议选MIT对开源项目最友好我建议仓库名用英文且避免特殊字符比如你想搭建技术博客可以用tech-blog想展示作品可以用portfolio。2.2 上传网站文件仓库创建后我们需要准备网站的核心文件。最基本的静态网站只需要index.html必须存在作为网站首页css/存放样式文件js/存放脚本文件images/存放图片资源你可以手动编写HTML也可以使用Hexo、Hugo等静态网站生成器。这里给个最简单的index.html示例!DOCTYPE html html head meta charsetutf-8 title我的个人网站/title link relstylesheet hrefcss/style.css /head body h1欢迎来到我的小站/h1 p这里将分享我的技术笔记和创作作品/p script srcjs/main.js/script /body /html上传文件有两种方式网页直传在仓库页面点击上传文件按钮拖拽本地文件到指定区域Git命令推荐git clone https://gitee.com/你的用户名/仓库名.git cd 仓库名 # 将网站文件复制到该目录后执行 git add . git commit -m 首次提交网站文件 git push origin master3. 开启Pages服务的详细指南3.1 基础配置文件上传完成后在仓库页面点击服务→Gitee Pages你会看到如下选项部署分支通常选master/main部署目录保持默认/除非你把网站文件放在子目录强制使用HTTPS建议勾选点击启动按钮后如果仓库未实名认证会提示你先认证。认证过程很简单按页面指引完成身份证上传和人脸识别即可通常30分钟内就能通过。3.2 自定义域名可选虽然.gitee.io的域名已经很好用但如果你想用自己购买的域名比如www.yourname.com可以在Pages设置里填写域名然后到域名服务商处添加CNAME记录指向username.gitee.io。不过要注意Gitee Pages不支持裸域名即不带www的域名国内域名需完成ICP备案每个仓库只能绑定一个自定义域名4. 进阶技巧与常见问题4.1 自动化部署方案每次手动上传文件太麻烦可以配置GitHub Actions或Gitee Go实现自动部署。以Gitee Go为例在仓库根目录创建.gitee/.workflow目录新建build.yml文件内容如下name: Build and Deploy steps: - name: Deploy to Gitee Pages uses: yanglbme/gitee-pages-actionmain with: gitee-username: ${{ secrets.GITEE_USERNAME }} gitee-password: ${{ secrets.GITEE_PASSWORD }} gitee-repo: 你的仓库名在仓库设置中添加GITEE_USERNAME和GITEE_PASSWORD两个密钥这样每次git push代码时系统会自动构建并更新网站。4.2 解决404问题新手最常遇到的两个问题访问域名显示404检查仓库是否已开启Pages服务确认仓库根目录有index.html清除浏览器缓存再试CSS/JS文件加载失败检查文件路径是否正确建议使用相对路径确认文件已成功上传在浏览器按F12查看网络请求详情4.3 网站美化建议想让你的.gitee.io网站更专业可以考虑使用Bootstrap等前端框架快速搭建响应式布局接入Disqus或Gitalk评论系统添加Google Analytics访问统计使用免费CDN加速静态资源我自己的技术博客就是基于Gitee Pages搭建配合VuePress生成文档既保留了动态网站的效果又享受了静态部署的便利。最重要的是三年多来从没为服务器维护操过心所有精力都可以专注在内容创作上。
