git和gulp使用
目錄
目錄 2
第1章 工作流程 4
第2章 Shell和vi 4
2.1 什麽是shell 4
2.2 shell分類 5
2.3 認識bash這個shell 5
2.4 vi編輯器 6
第3章 版本控制 8
3.1 關於版本控制 8
3.2 本地版本控制系統 9
3.3 集中式版本控制系統 9
3.4 分布式版本控制系統 10
第4章 Git 12
4.1 Git工作原理 12
4.2 Git安裝 13
4.3 Git本地倉庫 13
4.3.1 Git基礎 13
4.3.2 Git分支 17
4.4 Git遠程倉庫 22
4.5 gitHub和gitLab 26
4.6 沖突解決 29
4.7 Git高級 30
第5章 項目發布 30
第1章工作流程
以畫圖的形式展現實際工作中的工作流程
GIT就是前端和後臺接口聯調的時候的版本控制工具，意思就是前後端共同開發的時候，需要互相配合互相需要對方改代碼，但是改了之後不能用優盤拷貝，每次改都要拷貝麻煩，用git等工具就能實現。
第2章Shell和vi
2.1 什麽是shell
在計算機科學中，Shell俗稱殼，用來區別於Kernel（核），是指“提供使用者使用界面”的軟件（命令解析器）。它類似於DOS下的command和後來的cmd.exe。它接收用戶命令，然後調用相應的應用程序。
2.2 shell分類
1、圖形界面shell：通過提供友好的可視化界面，調用相應應用程序，如windows系列操作系統，Linux系統上的圖形化應用程序GNOME、KDE等。
2、命令行shell：通過鍵盤輸入特定命令的方式，調用相應的應用程序，如windows系統的cmd.exe、Windows PowerShell，Linux系統的Bourne shell ( sh)、Bourne Again shell ( bash)等。
2.3 認識bash這個shell
各個 shell 的功能都差不多， Linux 默認使用 bash ，所以我們主要學習bash的使用。
1、bash命令格式
命令 [-options] [/參數]，如：tar zxvf demo.tar.gz
查看幫助：命令 --help
2、bash常見命令
pwd (Print Working Directory) 查看當前目錄
cd (Change Directory) 切換目錄，如 cd /etc
ls (List) 查看當前目錄下內容，如 ls -al 可查看隱藏的文件
mkdir (Make Directory) 創建目錄，如 mkdir blog
touch 創建文件，如 touch index.html
wc (Word Count) 字數信息統計，如 wc index.html
cat 查看文件全部內容，如 cat index.html
more/less 查看文件，如more /etc/passwd、less /etc/passwd
Q(quit) : 退出這個狀態，而非退出程序
rm (remove) 刪除文件，如 rm index.html、rm -rf blog
rmdir (Remove Directory) 刪除文件夾，只能刪除空文件夾，不常用
Rm -r demo/ 刪除文件夾 這種方式比較常用
Rm -rf demo/ 強制刪除文件夾 慎用
Cd .. 進入上一層目錄
mv (move) 移動文件或重命名，如 mv index.html ./demo/index.text
cp (copy) 復制文件，cp index.html ./demo/index.html
head 查看文件前幾行，如 head -5 index.html
tail 查看文件後幾行 –n –f，如 tail index.html、tail -5 index.html
tab 自動補全，連按兩次會將所有匹配內容顯示出來
history 查看操作歷史
ssh 遠程登錄，如ssh [email protected]
> 和 >>重定向，如echo hello world! > README.md，>覆蓋 >>追加
wget 下載，如wget https://nodejs.org/dist/v4.4.0/node-v4.4.0.tar.gz
tar 解壓縮，如tar zxvf node-v4.4.0.tar.gz
curl 網絡請求，如curl http://www.baidu.com
who am i 查看當前用戶
| 管道符
grep 匹配內容（包含某個字符的都可以），一般結合管道符使用
2.4 vi編輯器
如同Windows下的記事本，vi編輯器是Linux下的標配，通過它我們可以創建、編輯文件。它是一個隨系統一起安裝的文本編輯軟件。
1、三種模式
vi編輯器提供了3種模式，分別是命令模式、插入模式、底行模式，每種模式下用戶所能進行的操作是不一樣的。
3種模式的切換如下圖所示：
通過上圖我們發現，輸入模式是不能直接切換到末行模式的，必須要先切回到命令模式（按ESC鍵）
2、使用vi編輯器
a) 打開/創建文件， vi 文件路徑
b) 底行模式 :w保存，:w filenme另存為
c) 底行模式 :q退出
d) 底行模式 :wq保存並退出
e) 底行模式 :e! 撤銷更改，返回到上一次保存的狀態
f) 底行模式 :q! 不保存強制退出
g) 底行模式 :set nu 設置行號
h) 命令模式 ZZ（大寫）保存並退出
i) 命令模式 u轍銷操作，可多次使用
j) 命令模式 dd刪除當前行
k) 命令模式 yy復制當前行
l) 命令模式 p 粘貼內容
m) 命令模式 ctrl+f向前翻頁
n) 命令模式 ctrl+b向後翻頁
o) 命令模式 i進入編輯模式，當前光標處插入
p) 命令模式 a進入編輯模式，當前光標後插入
q) 命令模式 A進入編輯模式，光標移動到行尾
r) 命令模式 o進入編輯模式，當前行下面插入新行
s) 命令模式 O進入編輯模式，當前行上面插入新行
當我們處在編輯模式的情況下，和我們在Windows編輯器的使用相似。
2.5 SSH
SSH 為 Secure Shell 的縮寫，SSH是一種網絡協議，用於計算機之間的加密登錄。
SSH只是一種協議，存在多種實現，既有商業實現，也有開源實現。本文針對的實現是OpenSSH，它是自由軟件，應用非常廣泛。
如果要在Windows系統中使用SSH，會用到另一種軟件PuTTY，我們後面用到的Git客戶內置集成了SSH
ssh [email protected]
非對稱加密技術
公鑰、私鑰 免密碼登錄
第3章版本控制
3.1 關於版本控制
版本控制（Version Control Systems）是一種記錄一個或若幹文件內容變化，以便將來查閱特定版本修訂情況的系統。這個系統可以自動幫我們備份文件的每一次更改，並且可以非常方便的恢復到任意的備份（版本）狀態。
舉例：我們通常都是手動的重命名一個文件進行備份的，index.html改成index1.html或者index.html.bak等形式，然後這種方式對於單個文件我們還能夠管理，但是對於整個項目而言，就會成為噩夢了！！！
3.2 本地版本控制系統
如下圖所示，文件被修改後，記錄下了3個版本，這樣我們通過版本控制系統便可以非常方便的恢復到任意版本。
3.3 集中式版本控制系統
實際開發環境，一個項目通常是由多人協作共同完成的，如何讓在不同系統上的開發者協同工作成了亟待解決的問題，集中式版本控制系統便應運而生了。它通過單一的集中管理的服務器，保存所有文件的修訂版本，協同工作的開發者都通過客戶端連到這臺服務器，取出最新的文件或者提交更新。其代表為SVN，如下圖所示。
這種方式很好解決了多人協同開發的問題，但是也有一個弊端，如果集中管理的服務器出現故障，將會導致數據（版本）丟失的風險，另外協同開發者從集中服務器中更新數據時，嚴重依賴網絡，如果網絡不佳，也給開發帶來諸多不便。
3.4 分布式版本控制系統
分布式版本控制系統，則不需要中央服務器，每個協同開發者都擁有一個完整的版本庫，這麽一來，任何協同開發者用的服務器發生故障，事後都可以用其它協同開發者本地倉庫恢復。
由於版本庫在本地計算機，也便不再受網絡影響了。如果要將本地的修改，推送給其它協同開發者，還需要一臺共享服務器，所有開發者通過這臺共享服務器提交和更新數據。如下圖所示。
分布式版本控制系統彌補了前面兩種版本控制系統的缺陷，成為了版本控制的首選方案。其代表就是Git。
第4章Git
4.1Git工作原理
為了更好的學習Git，我們們必須了解Git管理我們文件的3種狀態，分別是已修改（modified）,已暫存（staged）和已提交（committed），由此引入 Git 項目的三個工作區域的概念：Git 倉庫、工作目錄以及暫存區域。
Git倉庫目錄是Git用來保存項目的元數據和對象數據庫的地方。 這是Git 中最重要的部分，從其它計算機克隆倉庫時，拷貝的就是這裏的數據。
工作目錄是對項目的某個版本獨立提取出來的內容。 這些從Git倉庫的壓縮數據庫中提取出來的文件，放在磁盤上供你使用或修改。
暫存區域是一個文件，保存了下次將提交的文件列表信息，一般在Git倉庫目錄中。有時候也被稱作“索引”（Index），不過一般說法還是叫暫存區域。
基本的Git工作流程如下：
1、在工作目錄中修改文件。
2、暫存文件，將文件的快照放入暫存區域。
3、提交更新，找到暫存區域的文件，將快照永久性存儲到Git倉庫目錄。
4.2Git安裝
Window安裝
http://git-scm.com/download/win下載Git客戶端軟件，和普通軟件安裝方式一樣。
Linu安裝
CentOS發行版：sudo yum install git
Ubuntu發行版：sudo apt-get install git
Mac安裝
打開Terminal直接輸入git命令，會自動提示，按提示引導安裝即可。
4.3 Git本地倉庫
4.3.1 Git基礎
命令行方式：任意目錄（建議開發目錄）右鍵 > Git Bash Here
1、配置用戶
git config --global user.name "自已的名字"
git config --global user.email "自已的郵箱地址"
--global 配置當前用戶所有倉庫
--system 配置當前計算機上所有用戶的所有倉庫
2、初始化倉庫
git init
git init只是創建了一個名為.git的隱藏目錄，這個目錄就是存儲我們歷史版本的倉庫，ls -al 可以查看。
3、查看文件狀態
git status可以檢測當前倉庫文件的狀態
4、添加文件到暫存區
git add file “*”或-A代表所有
放到暫存區的文件被標記成了綠色，等待提交。
5、提交文件
git commit -m ‘備註信息‘
將暫存區被標記成綠色的文件，全部提交到倉庫存儲。
6、查看提交歷史
git log
我們可以查看到一次提交記錄，97b101e7d代表這次提交的唯一ID，一般稱為SHA值。傻？
這時我們對index.html文件做修改
7、再次檢測倉庫文件狀態
git status
被修改過的文件被標記成了紅色，等待重新添加到暫存區。
8、重新添加暫存區然後提交
git add index.html
git commit -m ‘add some words‘
9、再次查看歷史
git log 可查到所有提交歷史
這時可以查看到兩次提交歷史。
這時關掉所有目錄甚至關機！
10、恢復上一次提交的狀態
git reset —hard 97b101e7d 查看index.html發現回到了沒有修改的狀態
git reset 97b101e7d 不加hard歷史（head）改了，但是工作區不會變
git log再次查看發現提交歷史只有一個了
Git reflog 才能看到所有的提交歷史，有了所有歷史就能通過 git reset —hard ……來恢復到任意以前的狀態了（不過不能太久以前的）
這時我們非常容易就回到了曾經的一個歷史版本。
倉庫示意圖
版本庫：包括 index (暫存區)和 倉庫
4.3.2 Git分支
在我們的現實開發中，需求往往是五花八門的，同時開發個需求的情況十分常見，比如當你正在專註開發一個功能時，突然有一個緊急的BUG需要你來修復，這個時候我們當然是希望在能夠保存當前任務進度，再去修改這個BUG，等這個BUG修復完成後再繼續我們的任務。如何實現呢？
通過創建分支來解決實際開發中類似的問題。
如下圖所示：
當我們在初始化倉庫的時候，Git會默認幫我們創建了一個master的分支，並且HEAD默認指向了master末端。
我們也可以創建自已的分支
1、創建分支
git branch hotfix
圖4-1
2、切換分支
git checkout hotfix
圖4-2
我們發現HEAD現在又指向了developer的末端。
3、再次提交操作
git add -A
git commit -m ‘add some code for hotfix‘
圖4-3
這次的提交歷史版本就會記錄在developer這個分支上了，並且HEAD伴隨developer在移動。
4、當我們再次切回到master時
git checkout master
圖4-4
當我們切換回master後，HEAD指向了master分支的末端。
5、繼續之前的開發
git add -A
git commit -m ‘add some code for master‘
圖4-5
總結：當我們git checkout branchname時，HEAD會自動指向對應分支的末端，工作目錄中的源碼也會 隨之發生改變。
這個時候我們就在hotfix這個分支上修復了這個BUG，而我們原來在master分支上的操作並未受到影響。
思考一個問題：
現在master這個分支上是否包含了hotfix的修復呢？
實際上從圖4-5可以看出這時的master分支並沒有包含有hotfix的修復。
6、合並（融合）分支
git checkout master
git merge hotfix
圖4-6
這時master會有兩個父結點了，master便包含了hotfix裏的修復了
7、刪除分支
git branch -d hotfix
這時用來修復BUG創建的hotfix分支已經沒有用處了，我們可以將它刪除。
圖4-7
4.4 Git遠程倉庫
通過上面學習我們可以很好的管理本地版本控制了，可是如果我們下班回到家裏突然來了靈感覺得有部分代碼可以優化，如果能接著公司電腦上的代碼繼續寫該有多好呀！另一種情形，假設項目比較大，不同的功能模塊由不同的開發人員完成，不同模塊兒之間又難免會依賴關系，這時如果我們的代碼互相合並（融合）該有多好呀！所有模塊開發完畢後，需要整合到一起，要能做到準確無誤該有多好呀！
借助一個遠程倉庫，大家可以共享代碼、歷史版本等數據，便可以解決以上遇到的所有問題，在學習遠程倉庫前我們先來學習git clone path這個命令。
1、獲取已有倉庫的副本
在blog這個目錄同級執行
git clone ./blog 目錄名稱
2、進入到demo目錄中
cd demo
git log可以看到全部的提交歷史
這時我們可以認為這個這個blog其實就是一個“共享的”倉庫了，但是要想創建一個真正的共享倉庫，需要做一些特殊的處理。
3、創建共享倉庫
Git要求共享倉庫是一個以.git結尾的目錄。
mkdir repo.git 創建以.git結尾目錄
cd repo.git 進入這個目錄
git init --bare 初始化一個共享倉庫，註意選項--bare
這樣我們就建好了一個共享的倉庫，但這時這個倉庫是一個空的倉庫。
以上是我們直接創建裸倉庫的步驟，除了上面的方法外，我們還可以通
git clone --bare 倉庫地址的形式，將已有一個倉庫導出成裸倉庫。
4、向共享倉庫共享內容
進入到本地的倉庫 copy
cd copy
git push ../repo.git master
5、從共享倉庫裏取出內容
git clone ./repo.git demo
通過repo.git共享倉庫，我們輕松得到了一個copy的副本
6、通過demo倉庫向repo.git共享內容
進入到demo裏，我們做一些修改
cd demo
git push ../repo.git master
7、在copy倉庫從repo.git獲取共享的內容
cd copy
git pull ../repo.git master
奇跡似乎發生了，我們輕松的將demo倉庫裏的內容，通過repo.git共享給了copy倉庫。
驚喜不斷，問題也總是不斷，我們發現我們這個共享的倉庫只是放到了本地的，其它人是沒有辦法從我們這個共享倉庫共享內容的！！！
然而現實是，辦法總是有的！！！！
我們把這個共享的倉庫放到一臺遠程服務器上，問題不就解決了嗎？
4.5 gitHub和gitLab
如果我們熟悉服務器的話，我們完全可以將上述的步驟在我們的遠程服務器上進行操作，然後再做一些登錄權限的設置，就可非常完美的搭建一個共享服務器了，但是為了可以更好的管理我們的倉庫，一些第三方機構開發出了Web版倉庫管理程序，通過Web界面形式管理倉庫。
gitHub關於它的名氣與意義，大家可以自行查閱，我們這裏介紹它的使用
1、註冊賬號並完善資料
自行註冊略過
2、創建共享倉庫
3、填寫倉庫資料
4、共享倉庫
遠程地址特別長，我們可以給他起一個別名
git remote add origin [email protected]:Botue/repo.git
這樣origin 就代表 [email protected]:Botue/repo.git
當我們通過git clone 從共享倉庫獲內容時，會自動幫我們添加origin到對應的倉庫地址，例如：git clone [email protected]:Botue/repo.git 會自動添加origin 對應 [email protected]:Botue/repo.git
5、生成密鑰
ssh-keygen -t rsa 然後一路回車，這裏會在當前用戶生成了一個.ssh的文件夾
將id_rsa.pub公鑰的內容復制
打開gitHub的個人中心
打到SSH keys
到此我們便可以通過gitHub 提供的Web界面來管理我們的倉庫了。
我們發現通過gitHub管理倉庫實在是太方便了，可是只能免費使用公開倉庫，自已公司的代碼當然不能公開了，可是私有倉庫又是需要交“保護費”的，無耐國人還是比較喜歡免費的，網絡界總是有很多雷峰的，比如gitLab!!!
gitLab也是一個可以通過Web界面管理倉庫的網站程序，我們可以把它架設到公司自已的服務器上，實現倉庫私有化，這也是大部分公司通常采用的方法，其使用方法與gitHub十分相似。
我將閑置電腦配置成了一臺服務器，上面架設了gitLab程序，我們接下來的練習全部會在gitLab上進行演示。
省略很多內容.....
4.6 沖突解決
假如兩個開發同時改到同一文件的同一段內容會發生什麽事情呢？
這時就會就會產生沖突了
4.7 命令匯總
git config配置本地倉庫
常用git config --global user.name、git config --global user.email
git config --list查看配置詳情
git init 初始一個倉庫，添加--bare可以初始化一個共享倉庫
git status 可以查看當前倉庫的狀態
git add“文件” 將工作區中的文件添加到暫存區中，其中file可是一個單獨的文件，也可以是一個目錄、“*”、-A
git commit -m ‘備註信息‘ 將暫存區的文件，提交到本地倉庫
git log 可以查看本地倉庫的提交歷史
git branch查看分支
git branch“分支名稱” 創建一個新的分支
git checkout“分支名稱” 切換分支
Git checkout -b developer 創建並切換到developer分支
git merge“分支名稱” 合並分支
git branch -d “分支名稱” 刪除分支
git clone “倉庫地址”獲取已有倉庫的副本，會默認創建master分支
git push “倉庫地址” “本地分支名稱:遠程分支名稱”將本地分支推送至遠程倉庫，
Git push origin hotfix(通常都這麽寫) 相當於
Git push origin hotfix:hotfix
Gt push origin hotfix:newfeature
本地倉庫分支名稱和遠程倉庫分支名稱一樣的情況下可以簡寫成一個，即git push “倉庫地址” “分支名稱”，如果遠程倉庫沒有對應分支，將會自動創建
git remote add “主機名稱” “遠程倉庫地址”添加遠程主機，即給遠程主機起個別名，方便使用
git remote 可以查看已添加的遠程主機
git remote show “主機名稱”可以查看遠程主機的信息
GitLab完整演示
沒錯，Git非常強大！
但是，如果我們的分支不加以規範管理，也有可能適得其反！
1、不要有太多的樹杈（子分支）
2、要有一個“穩定分支”，即master分支不要輕意被修改，要在master分支上創建分支，因為master是最穩定且最新的！
3、要有一個平行分支(跟master分支保持同步，保持一模一樣)，保證master分支的穩定性. 創建的平行分支要確認沒有bug了，才放到master分支，也就是說不要直接push到master分支！
畫圖
同一個功能最好都共用同一個分支
沖突解決
假如兩個開發同時改到同一文件的同一段內容會發生什麽事情呢？
這時就會就會產生沖突了。
產生沖突時，要先pull下對方push的，然後找到沖突，協商解決後再push
4.8 Git高級
熟悉掌握以上操作，基本上是可以滿足日常開的需要的，但是在解決一些特殊問題時，就又需要我們能夠掌握更多的命令。
4.8.1 gitignore忽略文件
在項目根目錄下創建一個.gitignore文件，可以將不希望提交的羅列在這個文件裏，如項目的配置文件、node_modules等
https://github.com/github/gitignore
4.8.2 比較差異
當內容被修改，我們無法確定修改哪些內容時，可以通過git diff來進行差異比較。
git diff 比較的是工作區和暫存的差異
Git difftool 會分屏比對，很好用！
git diff “提交ID”比較與特定提交的差異
git diff 提交ID 提交ID比較某兩次提交的差異
git diff 分支名稱 比較與某個分支的差異
2、回滾（撤銷）操作
HEAD 默認指向當前分支的“末端”，即最後的一次提交，但是我們通過git reset 可以改變HEAD的指向。
看情況解釋
git reset
--hard 工作區會變、歷史(HEAD)會變， 暫存區也變
--soft 只會變歷史(HEAD)
--mixed（默認是這個選項）歷史(HEAD)會變、暫存區也變, 工作區不變
git checkout
git checkout SHA -- "某個文件"，代表只是從SHA這個版中取出特定的文件，
和git reset 是有區別的，rest 重寫了歷史，checkout 則沒有。
git revert
可以將某一次push完全的反向操作，然後當成一次新 commit，這時我們再重新push 即可。
4.8.3 更新倉庫
在項目開發過程中，經常性的會遇到遠程（共享）倉庫和本地倉庫不一致，我們可以通過git fetch 命令來更新本地倉庫，使本地倉庫和遠程（共享）倉庫保持一致。
git pull origin 某個分支， 相當於下面兩步
git fetch
git merge origin/某個分支
git fetch “遠程主機” “分支名稱”
Git fetch -p
我們要註意的是，利用git fetch 獲取的更新會保存在本地倉庫中，但是並沒有體現到我們的工作目錄中，需要我們再次利用git merge來將對應的分支合並（融合）到特定分支。
刪除遠程分支 git push origin —delete demo1
問題？如何查看遠程主機上總共有多少個分支？
git fetch origin 與遠程倉庫同步
git branch -a 便可以查看所有分支了
原理，通過git fetch origin 獲取遠程主機的最新數據，然後git branch -a從便可以查看本地+遠程所有的他支了。
4.9 其它
Ctr + c (cancel) 取消
git stash
git stash pop
git push origin --delete 分支名稱
git push origin :分支名稱
第5章項目發布
5.1 項目構建
當一個項目足夠大的時候，我們會采按功能劃分給不同的人員開發，進一步各個功能又會劃分成不同的模塊進行開發，這就會造成一個完整的項目實際上是由許許多多多的“代碼版段”組成的；我們開發中又會用到less、sass等一些預處理程序，需要將這些預處理程序進行解析；為了減少請求需要將css、javascript進行合並；為了加速請求需要對html、css、javascript、images進行壓縮；這一系列的任務完全靠手功完成幾乎是不可能的，需要借助構建工具才可以實現。
所謂構建工具是指通過簡單配置就可以幫我們實現合並、壓縮、校驗、預處理等一系列任務的軟件工具。
常見的構建工具包括：Grunt、Gulp、F.I.S（百度出品）
5.2 Gulp
在了解了構建工具的用途，並且知道其只是一個軟件後，接下來我們重點學習如何使用Gulp這個軟件來工作。
5.2.1 Gulp基礎
Gulp是基於Nodejs開發的一個構建工具。
1、全局安裝
npm install -g gulp
2、本地安裝（做為項目依賴）
在項目根目錄下執行
npm install gulp --save-dev
3、創建任務清單gulpfile.js
4、定義任務
比如自動添加CSS私有前綴
本地安裝gulp-autoprefixer --save-dev
5、執行任務
輸入命令 gulp
這樣我們的CSS文件便會被自動的添加了瀏覽器私有前綴了
5.2.2 Gulp API
5.2.3 常用Gulp插件
Gulp-uglify
Gulp-autoprefixer
Gulp-htmlmin
Gulp-less
Gulp-livereload
Gulp-minify-css
Gulp-imagemin
Gulp-concat
gulp插件庫：
http://gulpjs.com/plugins/
git和gulp使用