前军教程网

中小站长与DIV+CSS网页布局开发技术人员的首选CSS学习平台

10分钟搭建属于你自己的个人网站02 #vuepress

10 分钟 0 成本搭建个人主页 02。

说说如何将本地静态网页部署到 GitHub 上!

1. 在上期视频中已经使用 viewpress 的主题在本地起了这么一个文档类型的静态网页,但目前只能本地访问,接下来要将它部署到 GitHub 上。首先在 GitHub 上新建一个仓库,描述是一棵树的博客,直接 create。

2. 接下来再创建一个分支,用于存放给外域访问的静态网页,比如 pages。

3. 创建完分支后进入分支进行相关配置以保障能被外域访问:来到 settings,选择 pages,选择要被外域访问的分支即 pages,点击 save 保存。保存后稍等刷新,就能看到提供的可对外访问域名了,此时里面什么都没有,还有最后一步配置。

4. 接下来生成 access TOKEN:来到主页,选择 settings,在 settings 里选择 deploy settings,再选 personal access TOKEN,再选第二个 classic 的 tokens,点击 generate a new TOKEN,生成新 TOKEN,选第二个,可为 TOKEN 加注释如博客 token,有效期选 no pressure 即永远不会过期,作用是能更新修改 repository 根据仓库 generate。生成后复制到刚才仓库用于后续操作,来到 block 仓库,在 block 仓库下选择 settings,放在 secrets and variables 下,选择 action,选择 new repostery secret,粘贴进来并改名如 access TOKEN,给仓库加了个 XS TOKEN。

5. 到这一步 GATEHUB 上相关配置完成,接下来要把代码发布到 GATEHUB 上。回到代码,修改 deploy-docs 文件,首先改部署分支,要把静态代码部署到新建配置字母分支上,还要把设置密钥复制过来作为环境变量贴进 token,变量名称是 ACC ESS TOKEN,前面是 secret 前缀,这样就引入 xTOKEN 了。因个人习惯,喜欢把代码推到 master 份之上,所以对应 deploy 文件下的 branch 也要改,改成 master。还要来到 configure 点 test 修改路径,因为看到 guitar 给的域名前有 blog 前缀,所以要加 blog 前缀。

6. 接下来提交代码并推送到对应分支上。刷新后看到 master 分支上已有推送上来的代码,点进去可看到文档在初始化,稍作等待后刷新,编译好了。此时再看博客,刷新就可看到原本只能本地访问的网站现在可通过 cut house 上的域名访问了。

到这里部署结束,后续可根据自己需要修改代码及里面的 macdown 文件来形成个人主页。

本次视频原码和说明文档可通过主页获取,下期再见。

发表评论:

控制面板
您好,欢迎到访网站!
  查看权限
网站分类
最新留言