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網頁