Github创建网页全过程
一、前期准备
1.安装Git
官方文档点击->set-up git
直接下载点击->gihub 客户端
下载安装客户端根据向导提示安装即可(当作普通的软件安装即可),可以安装在非系统盘。
客户端下载后内容包括:Git Bash、Git CMD、Git GUI,其中GUI就是图形操作界面
2.安装jekyll
jekyll官方安装文档->set-up jekyll
1).下载ruby组件->rubyinstaller download,选择官方推荐的Ruby+Devkit 2.6.6-1 (x64)。
注意此文撰写时间为2020.4,官方推荐的组件随着时间推移可能会修改,大家根据rubyinstaller download链接内的官方说明选择下载即可。
2).按照安装向导安装:
next继续安装,在向导的最后一页勾选运行:
ridk install
点击finish后出现cmd界面:
直接按回车,安装成功后显示:
回车完成安装并关闭。
3).在开始菜单中,启动“start command prompt with Ruby”,来让path环境变量生效
4).在打开的command prompt中:
进入刚刚安装路径下的/Ruby26-x64/bin/,并输入以下命令
gem install jekyll bundler
如果按了回车没有反应就再按一次(不要多按),多等一会比较慢,会出现很多安装信息,最后没有报错退回路径就行了
5).查看jekyll是否安装成功(显示jekyll版本信息即安装成功)
jekyll -v
3.安装bundler
bundler官方文档->set-up bundler
打开命令行窗口并运行如下命令:
gem install bundler
ps:windows命令行窗口打开方式:win+R–>输入cmd并确认
此时你的bundler还不能用!因为还没配置!后面会配置!
二、创建本地网站(jekyll project)
github官方文档->creating a site
1. 打开Git Bash并进行后续命令行操作
2. 进入你要用来存储repository的文件夹(没有就创建文件夹)
cd PARENT-FOLDER
PARENT-FOLDER替换成你创建好的要用来存储repository的文件夹。
比如你要放在目录“D:/Git/myrepo/”下面,而这两个文件夹你都没创建,那么你要依次输入运行以下的命令行:
mkdir Git cd Git mkdir myrepo cd myrepo
笔者的存储路径为:D:/Git/Jekyll/siteSourceFile/
3. 如果你没有初始化过本地的repository(一般都没有),那么要先初始化一个
git init REPOSITORY-NAME
效果如下,mysite就是我的REPOSITORY-NAME,即我的本地仓库
4. 进入repository文件夹
cd REPOSITORY-NAME
这个时候bash显示为:
注意到有一个(master)字样,因为如果是创建一个user或organization site是必须把网站源码放在master brach下的。如果是另外的project下创网站可以参考官方文档
5. 在 目录 "XX/REPOSITORY-NAME/” 下新建文件‘Gemfile’并在文件中写入:
source 'https://rubygems.org'
gem 'nokogiri'
gem 'rack', '~> 2.0.1'
gem 'jekyll', '~> 4.0.0'
gem 'rspec'
jekyll的版本号根据你安装的为准,笔者为4.4.0。
ps:文件名不要加后缀,拿记事本或者vi命令打开就行,这个文件是为了配置bundler
6. 在命令行中输入:
bundle install
结束后文件夹内容为:
7. 创建并进入docs文件夹
mkdir docs
cd docs
你将从master branch的docs文件夹中发表网站
8.用bundler新建jekyll项目
bundle exec jekyll VERSION new .
!!new 后面有个‘.’不要忘了!!,意思是在当前文件夹下创建。
如果你要在别的路径下放,就把new替换成绝对路径,或者直接输文件夹名就会在当前路径下创建
创建结果为:
9.打开当前目录下的Gemfile
找到下图内容,取消第三行的注释并且加上这个插件的版本号,版本号查看点击–>dependency versions
笔者的配置如下,版本号为204:
保存并退出。
三、将本地网站push到github远程仓库中
1. 在github界面新建一个repository
和你本地repository的名字一样,笔者为mysite(最好是public,不要学我!且一定要带readme.md!)
2. 在Git Bash中将本地repository放入远程仓库
在目录"xxx/REPOSITORY-NAME"中进行以下命令
git init
git add .
git commit -m 'first commit'
git remote add origin https://github.com/USER/REPOSITORY.git
git push -u origin master
USER就是你的gihub账户名,REPOSITORY就是开始的那个REPOSITORY-NAME笔者为mysite
此时你的github页面为:
上传成功。
在这一步可能遇到的问题
1. 在gitpush时弹出界面让你登录
用github登录就行,SSH登录也一样
2.fatal: HttpRequestException encountered.
安装协议:GCM
选择windows的exe安装即可
3.git push错误failed to push some refs to
- 检查你的远程repository里有无README.md,没有就要先建一个
- 打开Git Bash,在本地的对应repository目录下运行
git pull --rebase origin master
,目的是同步远程仓库到本地 - 然后再执行本文中同步到远程仓库的步骤
四、运行网页
1. 在github repository中settings里找到enable网页