参考资料

npm官网·npm-link
博客·npm link中文文档
简书·npm link的使用

一、在全局环境的node_modules中，创建开发中的模块链接

此时github上的项目已经fork并clone到本地，切换到开发分支，在要开发的模块uform/packages/react-schema-renderer下，执行npm link。

这一步会以package.json中的name，在全局的node_modules中创建本地模块的链接，打开全局node_modules，会看到该链接：

二、在自己的测试项目中引用链接

在自己的项目中，执行npm link @uform/react-schema-renderer

这一步会将上一步全局环境中创建的链接引入测试项目中，打开测试项目的node_modules可以看到该链接：

参考资料

git文档·初次运行 Git 前的配置
git配置

git的配置文件

git通过配置文件来设置控制 Git 外观和行为，共有三个配置文件，权重为仓库级>全局级>系统级：

1. 系统级--system：/etc/gitconfig 文件，包含系统上每一个用户及他们仓库的通用配置；
2. 全局级--global：~/.gitconfig 或 ~/.config/git/config 文件，只针对当前用户；
3. 仓库级--local：.git/config，当前仓库的Git 目录中的 config 文件（就是 ）。

不同仓库使用不同用户信息

初次安装git时，曾执行如下命令设置你的用户名与邮件地址：

1
2

git config --global user.name "John Doe"
git config --global user.email johndoe@example.com

因为使用了 –global 选项，无论你在该系统上做任何事情， Git 都会使用这些信息。这些信息会写入到你的每一次提交中，且不可更改。工作电脑通常会全局配置公司邮箱和用户名，那么当提交到个人github时，也会使用公司邮箱和用户名。

我们想要的是提交个人github仓库使用个人用户名和邮箱，以下方法任选其一：

<方法一>如下命令可修改仓库级配置：

1
2

git config user.name "John Doe"
git config user.email johndoe@example.com

<方法二>打开仓库级配置文件修改：

1

open .git/config

完成后，再提交代码，git log查看提交信息，就会看到个人信息配置成功：

参考资料
https://www.jianshu.com/p/698f82e72415
https://segmentfault.com/a/1190000016269686

1. 查看已配置的git列表

1

git config --list

已有公司的ssh-key

2. 生成github SSH key

1

ssh-keygen -t rsa -f ~/.ssh/id_rsa_github -C "baoyuzhang@126.com"

3. 添加到ssh-agent信任列表

1

ssh-add ~/.ssh/id_rsa

1

ssh-add ~/.ssh/id_rsa_github

为了检验本地是否添加成功，可以使用ssh-add -l命令进行查看

4. 添加公钥到你的github

1

pbcopy < ~/.ssh/id_rsa_github.pub

5. 在config文件配置多个ssh-key

打开目录，看看有没有config文件，没有的话新建一个

1

open ~/.ssh/

分别配置公司和自己的ssh-key

1
2
3
4
5
6
7
8
9
10
11

#公司
Host company
Hostname #公司gitlab域名#
IdentityFile ~/.ssh/id_rsa
User company
  
#个人
Host github
Hostname github.com
IdentityFile ~/.ssh/id_rsa_github
User github

6. 连接测试

1

ssh -T #公司gitlab域名#

1

ssh -T git@github.com

（一）工具

Regexper：正则表达式可视化工具，看不懂的表达式放进去，帮助理解

（二）理论部分

一、正则表达式简介

正则表达式是一个强大的字符串匹配工具。

1.匹配模式标志flags

3 个匹配模式标志flags：标明正则表达式的行为

一个正则表达式就是一个模式与3 个标志的组合体

1
2
3

var pattern1 = /at/g; // 匹配字符串中所有"at"的实例
var pattern2 = /[bc]at/i; // 匹配第一个"bat"或"cat"，不区分大小写
var pattern3 = /.at/gi; // 匹配所有以"at"结尾的3 个字符的组合，不区分大小写

2.元字符

与其他语言中的正则表达式类似，匹配字符串中的元字符必须转义。

正则表达式中的元字符包括：( [ { \ ^ $ | ) ? * + . ] }

1
2
3
4

var pattern1 = /[bc]at/i; // 匹配第一个"bat"或"cat"，不区分大小写
var pattern2 = /\[bc\]at/i; // 匹配第一个" [bc]at"，不区分大小写
var pattern3 = /.at/gi; // 匹配所有以"at"结尾的3 个字符的组合，不区分大小写
var pattern4 = /\.at/gi; // 匹配所有".at"，不区分大小写

3.创建正则表达式

有两种方法，这两种方法完全等价。

<法一> 对象字面量

• 正则表达式放在一对斜杠（/）之间

1

var expression = / pattern / flags ;

<法二> 使用RegExp()构造函数

• 2个参数（均为字符串）：要匹配的字符串模式pattern，（可选）匹配模式标志flags

1
2

var pattern1 = /[bc]at/i; // 匹配第一个"bat"或"cat"，不区分大小写
var pattern2 = new RegExp("[bc]at", "i"); // 与pattern1 相同，只不过是使用构造函数创建的

注意！

1. 传递给RegExp 构造函数的2个参数都是字符串（不能把正则表达式字面量传递给RegExp 构造函数）
2. 由于RegExp 构造函数的模式参数是字符串，所以在某些情况下要对字符进行双重转义：
   • 所有元字符
   • 已经转义过的字符，例如：\n（字符\：在字符串中转义\\，在正则表达式字符串中双重转义\\\\）

二、RegExp类型

EMCAScript通过RegExp类型来支持正则表达式。

1
2
3

var reg = new RegExp("\\d{5}","g");//匹配全局模式下的5个数字
alert(reg.test("1J2a35786"));//true
alert(reg.test("1J2a356"));//false

局限性

要了解更多相关信息，请访问www.regular-expressions.info

尽管ECMAScript 中的正则表达式功能还是比较完备的，但仍然缺少某些语言（特别是Perl）所支
持的高级正则表达式特性。下面列出了ECMAScript 正则表达式不支持的特性:

• 匹配字符串开始和结尾的\A 和\Z 锚【但支持以插入符号（^）和美元符号（$）来匹配字符串的开始和结尾】
• 向后查找（lookbehind）【但完全支持向前查找（lookahead）】
• 并集和交集类
• 原子组（atomic grouping）
• Unicode 支持（单个字符除外，如\uFFFF）
• 命名的捕获组【但支持编号的捕获组】
• s（single，单行）和x（free-spacing，无间隔）匹配模式
• 条件匹配
• 正则表达式注释

即使存在这些限制，ECMAScript 正则表达式仍然是非常强大的，能够帮我们完成绝大多数模式匹
配任务。

1. RegExp构造函数属性

适用于作用域中的所有正则表达式，并且基于所执行的最近一次正则表达式操作而变化。

可以通过两种方式访问：长属性名、短属性名（Opera 是例外，它不支持短属性名）

短属性名大多不是有效的ECMAScript 标识符，必须通过方括号语法来访问。

使用这些属性可以从exec()或test()执行的操作中提取出更具体的信息：

1
2
3
4
5
6

var text = "this has been a short summer";
var pattern = /(..)or(.)/g;
if (pattern.test(text)){
alert(RegExp.$1); //sh
alert(RegExp.$2); //t
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14

var text = "this has been a short summer";
var pattern = /(.)hort/g;
/*
* 注意：Opera 不支持input、lastMatch、lastParen 和multiline 属性
* Internet Explorer 不支持multiline 属性
*/
if (pattern.test(text)){
alert(RegExp.input); // this has been a short summer
alert(RegExp.leftContext); // this has been a
alert(RegExp.rightContext); // summer
alert(RegExp.lastMatch); // short
alert(RegExp.lastParen); // s
alert(RegExp.multiline); // false
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14

var text = "this has been a short summer";
var pattern = /(.)hort/g;
/*
* 注意：Opera 不支持input、lastMatch、lastParen 和multiline 属性
* Internet Explorer 不支持multiline 属性
*/
if (pattern.test(text)){
alert(RegExp.$_); // this has been a short summer
alert(RegExp["$`"]); // this has been a
alert(RegExp["$'"]); // summer
alert(RegExp["$&"]); // short
alert(RegExp["$+"]); // s
alert(RegExp["$*"]); // false
}

2. RegExp实例属性

通过这些属性可以获知一个正则表达式的各方面信息，但却没有多大用处，因为这些信息全都包含在模式声明中。

1
2
3
4
5
6
7
8
9
10
11
12
13

var pattern1 = /\[bc\]at/i;
alert(pattern1.global); //false
alert(pattern1.ignoreCase); //true
alert(pattern1.multiline); //false
alert(pattern1.lastIndex); //0
alert(pattern1.source); //"\[bc\]at"

var pattern2 = new RegExp("\\[bc\\]at", "i");
alert(pattern2.global); //false
alert(pattern2.ignoreCase); //true
alert(pattern2.multiline); //false
alert(pattern2.lastIndex); //0
alert(pattern2.source); //"\[bc\]at"

3. RegExp实例方法

a.exec()：查找匹配字符串和捕获组

• 参数：正则表达式
• 返回：由匹配项组成的数组；没有匹配项返回null
  • 返回数组，第一项是与整个模式匹配
    的字符串，其他项是与捕获组匹配的字符串（如果模式中没有捕获组，则该数组只包含一项）
    • 假设macth()返回一个数组a，那么a[n]存放的是$n的内容：a[0]存放的是完整的匹配，a[1]存放的是第一个捕获组，以此类推。
  • 返回数组属性：
    • index ：匹配项在字符串中的位置
    • input ：待解析字符串

1
2
3
4
5
6
7
8

var text = "mom and dad and baby";
var pattern = /mom( and dad( and baby)?)?/gi;
var matches = pattern.exec(text);
alert(matches.index); // 0
alert(matches.input); // "mom and dad and baby"
alert(matches[0]); // "mom and dad and baby"
alert(matches[1]); // " and dad and baby"
alert(matches[2]); // " and baby"

说明

exec()方法：即使在模式中设置了全局标志g，它每次也只会返回一个匹配项：

• 不设置全局标志g：在同一个字符串上多次调用exec()将始终返回第一个匹配项的信息：

  （特例：IE 在非全局模式下，lastIndex 属性每次也会变化）

  1 2 3 4 5 6 7 8 9 10 11 12

  var text = "cat, bat, sat, fat"; var pattern1 = /.at/; var matches = pattern1.exec(text); alert(matches.index); //0 alert(matches[0]); //cat alert(pattern1.lastIndex); //0 matches = pattern1.exec(text); alert(matches.index); //0 alert(matches[0]); //cat alert(pattern1.lastIndex); //0

• 设置全局标志g：每次调用exec()会在字符串中继续查找新匹配项：

  1 2 3 4 5 6 7 8 9 10 11 12

  var text = "cat, bat, sat, fat"; var pattern2 = /.at/g; var matches = pattern2.exec(text); alert(matches.index); //0 alert(matches[0]); //cat alert(pattern2.lastIndex); //3 matches = pattern2.exec(text); alert(matches.index); //5 alert(matches[0]); //bat alert(pattern2.lastIndex); //8

b.test()：判断待解析字符串是否与此模式匹配

• 参数：待解析字符串
• 模式与参数匹配：返回true；否则，返回false

在只想知道目标字符串与某个模式是否匹配，但不需要知道其文本内容时，使用这个方法非常方便。因此，test()方法经常被用在if 语句中：

1
2
3
4
5

var text = "000-00-0000";
var pattern = /\d{3}-\d{2}-\d{4}/;
if (pattern.test(text)){
alert("The pattern was matched.");
}

c.继承的方法

• valueOf()方法：返回正则表达式本身
• toLocaleString()方法：返回正则表达式的字面量，与创建正则表达式的方式无关
• toString()方法：返回正则表达式的字面量，与创建正则表达式的方式无关

  1 2 3

  var pattern = new RegExp("\\[bc\\]at", "gi"); alert(pattern.toString()); // /\[bc\]at/gi alert(pattern.toLocaleString()); // /\[bc\]at/gi

三、待解析字符串的string方法

1. search()：查找匹配字符串位置

• 参数：正则表达式
• 返回：匹配子串的起始位置；未找到返回-1.
  • 例: JavaScript.search(/script/i);//返回4

说明：search()方法不支持全局属性检索，所以会忽略匹配模式标志g

2. replace()：替换

• 2个参数：正则，作为替换的字符串
  • 若第一个参数是字符串，replace()则会直接搜索这个字符串
  • 若作为替换字符串中出现了$数字，那么replace()将用与指定的子表达式相匹配的文本来替换这两个字符

1
2
3
4
5
6

text.replace(/javascript/gi,"JavaScript");//将所有不区分大小写的javascript都替换成大小写正确的JavaScript
//一段引用文本起始于引号，结束与引号
//中间的内容区域，不能包含引号
var quote = /"([^"]*)"/g;
//引用中文半角引号替换英文引号，同时要保持引号之间的内容(储存在$1中)没有被修改
text.replace(quote,'“$1”');

3. match()：查找匹配字符串和捕获组

• 参数：正则表达式
• 返回：由匹配结果组成的数组

1

"1 plus 2 equals 3".match(/\d+/g);//返回["1","2","3"]

说明

• match()始终返回一个数组。若没有匹配模式标志g，只检索第一个匹配，则数组的第一个元素是匹配的字符串，余下的元素是正则表达式中的捕获组（用圆括号括起来的子表达式）。
  • 假设macth()返回一个数组a，那么a[n]存放的是$n的内容：a[0]存放的是完整的匹配，a[1]存放的是第一个捕获组，以此类推。

• 例：解析一个url

1
2
3
4
5
6
7
8
9

var url = /(\w+):\/\/([\w.]+)\/(\S*)/;
var text = "Visit my blog at http://www.example.com/~david";
var result = text.match(url);
if (result != null) {
    var fullurl = result[0]; //包含 "http://www.example.com/"
    var protocol = result[1]; //包含 "http"
    var host = result[2]; //包含 "www.example.com"
    var path = result[3]; //包含~david
}

4. split()：分隔

• 参数：字符串/正则表达式

• 将字符串用传入的分隔符拆分为子串，返回：子串组成的数组

• 例：

  1 2 3 4

  // 参数为字符串 "123,456,789".split(",");//返回["123","456","789"] // 参数为正则表达式 "1,2, 3,4 ,5".split(/\s*,\s*/)//返回["1","2"," 3","4 ","5"]，指定分隔符”,”，允许两边留有任意多的空白符

四、正则表达式语法

1.转义字符

非字母的字符匹配，这些字符需要通过反斜线（\）作前缀进行转义.

具有特殊含义的符号（元字符）

| \ / ( ) [ ] { }  . : ! * + = ^ ? $

想要在正则表达式中对这些字符进行匹配，必须使用前缀”\”

其他标点符号（比如@和引号）无特殊含义，无需转义，直接使用即可。

2.字符类

方括号：或/范围

将直接量字符单独放进方括号内就组成了字符类。一个字符类可以匹配它包含的任意字符。字符类可以使用连字符来表示字符范围。

• 例:
  • /[a,b,c]/：表示和字母”a”,”b”,”c”中的任意一个都匹配
  • /[a-z]/：匹配拉丁字母表中的小写字母
  • /[\s\d]/：匹配任意空白符或数字

3.重复

用以指定字符重复的标记

• 例:

  • /\d{2,4}/:匹配2-4个数字。
  • /\w{3}\d?/:精确匹配三个单词和一个可选的数字。
  • /\s+java\s+/:匹配前后有1个或多个空格的字符串”java”
  • /[^(]*/:匹配0个或多个非左括号的字符(这里实际上能与"("匹配)

注意！

a. *和?能匹配0个字符。因此可以什么都不匹配

• 例:

  • /a*/能匹配字符串”bbbb”，因其含有0个a。

b. 上表中列出的匹配字符为”贪婪的”匹配

贪婪匹配 ：尽可能多地匹配，且允许后续的正则表达式继续匹配

非贪婪匹配 ：只匹配一次，在待匹配的字符后跟随一个问号即可，?，+?，*?或{1,5}?

• 例:
  • /a+/：匹配“aaa”时，三个字符都被匹配,
  • /a+?/：匹配“aaa”时，只匹配第一个a

4.选择-分组和引用

包括：指定选择项，自表达式分组，引用前一子表达式的特殊字符

• 选择项的尝试匹配次序是从左到右，直到发现匹配项，若左边成功匹配就忽略右边的项。
• 正则表达式中圆括号的作用：
  a. 把单独的项组成子表达式，以便于可以像处理独立单元一样，用\|,*,+或者?等等来对单元内的项进行处理
  b. 在完整的模式中定义子模式
  c. 允许在同一正则表达式的后部,引用前面的子表达式

• 例:
  • /ab|cd|ef/：可以匹配”ab”，也可以匹配”cd”，还可以匹配”ef”
  • /\d{3}|[a-z]{4}/：可以匹配3个数字，或者4个小写字母
  • (/[a-z]+(\d+)/)：匹配一个或多个小写字母后跟随了一位或多位数字，使用括号包裹后，可以从检索到的匹配中抽取数字了

5.指定匹配位置

正则表达式的锚，将模式定位在搜索字符串的特定位置上

• 例:
  • /^JavaScript$/:匹配”JavaScript”单词
  • /\B[Ss]cript/:与”JavaScript”和”/postscript”匹配，但不与”script”与”Script”.

（三）常用的正则表达式

以下内容转载自：http://www.cnblogs.com/zxin/archive/2013/01/26/2877765.html

一、校验数字的表达式

1. 数字：^[0-9]*$
2. n位的数字：^\d{n}$
3. 至少n位的数字：^\d{n,}$
4. m-n位的数字：^\d{m,n}$
5. 零和非零开头的数字：^(0|[1-9][0-9]*)$
6. 非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(.[0-9]{1,2})?$
7. 带1-2位小数的正数或负数：^(\-)?\d+(\.\d{1,2})?$
8. 正数、负数、和小数：^(\-|\+)?\d+(\.\d+)?$
9. 有两位小数的正实数：^[0-9]+(.[0-9]{2})?$
10. 有1~3位小数的正实数：^[0-9]+(.[0-9]{1,3})?$
11. 非零的正整数：^[1-9]\d*$ 或 ^([1-9][0-9]*){1,3}$ 或 ^\+?[1-9][0-9]*$
12. 非零的负整数：^\-[1-9][]0-9"*$ 或 ^-[1-9]\d*$
13. 非负整数：^\d+$ 或 ^[1-9]\d*|0$
14. 非正整数：^-[1-9]\d*|0$ 或 ^((-\d+)|(0+))$
15. 非负浮点数：^\d+(\.\d+)?$ 或 ^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0$
16. 非正浮点数：^((-\d+(\.\d+)?)|(0+(\.0+)?))$ 或 ^(-([1-9]\d*\.\d*|0\.\d*[1-9]\d*))|0?\.0+|0$
17. 正浮点数：^[1-9]\d*\.\d*|0\.\d*[1-9]\d*$ 或 ^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$
18. 负浮点数：^-([1-9]\d*\.\d*|0\.\d*[1-9]\d*)$ 或 ^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$
19. 浮点数：^(-?\d+)(\.\d+)?$ 或 ^-?([1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0)$

二、校验字符的表达式

1. 汉字：^[\u4e00-\u9fa5]{0,}$
2. 英文和数字：^[A-Za-z0-9]+$ 或 ^[A-Za-z0-9]{4,40}$
3. 长度为3-20的所有字符：^.{3,20}$
4. 由26个英文字母组成的字符串：^[A-Za-z]+$
5. 由26个大写英文字母组成的字符串：^[A-Z]+$
6. 由26个小写英文字母组成的字符串：^[a-z]+$
7. 由数字和26个英文字母组成的字符串：^[A-Za-z0-9]+$
8. 由数字、26个英文字母或者下划线组成的字符串：^\w+$ 或 ^\w{3,20}$
9. 中文、英文、数字包括下划线：^[\u4E00-\u9FA5A-Za-z0-9_]+$
10. 中文、英文、数字但不包括下划线等符号：^[\u4E00-\u9FA5A-Za-z0-9]+$ 或 ^[\u4E00-\u9FA5A-Za-z0-9]{2,20}$
11. 可以输入含有^%&’,;=?$\”等字符：[^%&',;=?$\x22]+
12. 禁止输入含有~的字符：[^~\x22]+

三、特殊需求表达式

1. Email地址：^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$

2. 域名：[a-zA-Z0-9][-a-zA-Z0-9]{0,62}(/.[a-zA-Z0-9][-a-zA-Z0-9]{0,62})+/.?

3. InternetURL：[a-zA-z]+://[^\s]* 或 ^http://([\w-]+\.)+[\w-]+(/[\w-./?%&=]*)?$
4. 手机号码：^(13[0-9]|14[5|7]|15[0|1|2|3|5|6|7|8|9]|18[0|1|2|3|5|6|7|8|9])\d{8}$
5. 电话号码(“XXX-XXXXXXX”、”XXXX-XXXXXXXX”、”XXX-XXXXXXX”、”XXX-XXXXXXXX”、”XXXXXXX”和”XXXXXXXX)：^(\(\d{3,4}-)|\d{3.4}-)?\d{7,8}$
6. 国内电话号码(0511-4405222、021-87888822)：\d{3}-\d{8}|\d{4}-\d{7}
7. 身份证号(15位、18位数字)：^\d{15}|\d{18}$
8. 短身份证号码(数字、字母x结尾)：^([0-9]){7,18}(x|X)?$ 或 ^\d{8,18}|[0-9x]{8,18}|[0-9X]{8,18}?$
9. 帐号是否合法(字母开头，允许5-16字节，允许字母数字下划线)：^[a-zA-Z][a-zA-Z0-9_]{4,15}$
10. 密码(以字母开头，长度在6~18之间，只能包含字母、数字和下划线)：^[a-zA-Z]\w{5,17}$
11. 强密码(必须包含大小写字母和数字的组合，不能使用特殊字符，长度在8-10之间)：^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$
12. 日期格式：^\d{4}-\d{1,2}-\d{1,2}
13. 一年的12个月(01～09和1～12)：^(0?[1-9]|1[0-2])$
14. 一个月的31天(01～09和1～31)：^((0?[1-9])|((1|2)[0-9])|30|31)$

15. 钱的输入格式：

    • 有四种钱的表示形式我们可以接受:”10000.00” 和 “10,000.00”, 和没有 “分” 的 “10000” 和 “10,000”：^[1-9][0-9]*$
    • 这表示任意一个不以0开头的数字,但是,这也意味着一个字符”0”不通过,所以我们采用下面的形式：^(0|[1-9][0-9]*)$
    • 一个0或者一个不以0开头的数字.我们还可以允许开头有一个负号：^(0|-?[1-9][0-9]*)$
    • 这表示一个0或者一个可能为负的开头不为0的数字.让用户以0开头好了.把负号的也去掉,因为钱总不能是负的吧.下面我们要加的是说明可能的小数部分：^[0-9]+(.[0-9]+)?$
    • 必须说明的是,小数点后面至少应该有1位数,所以”10.”是不通过的,但是 “10” 和 “10.2” 是通过的：^[0-9]+(.[0-9]{2})?$
    • 这样我们规定小数点后面必须有两位,如果你认为太苛刻了,可以这样：^[0-9]+(.[0-9]{1,2})?$
    • 这样就允许用户只写一位小数.下面我们该考虑数字中的逗号了,我们可以这样：^[0-9]{1,3}(,[0-9]{3})*(.[0-9]{1,2})?$
    • 1到3个数字,后面跟着任意个 逗号+3个数字,逗号成为可选,而不是必须：^([0-9]+|[0-9]{1,3}(,[0-9]{3})*)(.[0-9]{1,2})?$

    备注：这就是最终结果了,别忘了”+”可以用”* “替代如果你觉得空字符串也可以接受的话(奇怪,为什么?)最后,别忘了在用函数时去掉去掉那个反斜杠,一般的错误都在这里

16. xml文件：^([a-zA-Z]+-?)+[a-zA-Z0-9]+\\.[x|X][m|M][l|L]$

17. 中文字符的正则表达式：[\u4e00-\u9fa5]
18. 双字节字符：[^\x00-\xff] (包括汉字在内，可以用来计算字符串的长度(一个双字节字符长度计2，ASCII字符计1))
19. 空白行的正则表达式：\n\s*\r (可以用来删除空白行)
20. HTML标记的正则表达式：<(\S*?)[^>]*>.*?</\1>|<.*? /> (网上流传的版本太糟糕，上面这个也仅仅能部分，对于复杂的嵌套标记依旧无能为力)
21. 首尾空白字符的正则表达式：^\s*|\s*$或(^\s*)|(\s*$) (可以用来删除行首行尾的空白字符(包括空格、制表符、换页符等等)，非常有用的表达式)
22. 腾讯QQ号：[1-9][0-9]{4,} (腾讯QQ号从10000开始)
23. 中国邮政编码：[1-9]\d{5}(?!\d) (中国邮政编码为6位数字)
24. IP地址：\d+\.\d+\.\d+\.\d+ (提取IP地址时有用)
25. IP地址：((?:(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d)\\.){3}(?:25[0-5]|2[0-4]\\d|[01]?\\d?\\d))

（四）参考资料

JavaScript高级程序设计
正则表达式-理论基础篇
最全的常用正则表达式大全

参考资料：

• 使用hexo+github搭建免费个人博客详细教程-liuxianan：http://blog.liuxianan.com/build-blog-website-by-hexo-github.html
• Hexo官方使用文档：https://hexo.io/zh-cn/docs/
• NexT 官方使用文档：http://theme-next.iissnan.com/

前言

使用github pages服务搭建博客的好处有：

1. 全是静态文件，访问速度快；
2. 免费方便，不用花一分钱就可以搭建一个自由的个人博客，不需要服务器不需要后台；
3. 可以随意绑定自己的域名，不仔细看的话根本看不出来你的网站是基于github的；
4. 数据绝对安全，基于github的版本管理，想恢复到哪个历史版本都行；
5. 博客内容可以轻松打包、转移、发布到其它平台；
6. 等等；

准备工作

在开始一切之前，你必须已经：

• 有一个github账号，没有的话去注册一个；
• 安装了node.js、npm，并了解相关基础知识；
• 安装了git for windows（或者其它git客户端），安装过程在【Hexo搭建独立博客全纪录】（一）使用Git和Github中已讲过

本文所使用的环境：

• Windows7
• node.js@6.9.4 —— git命令行输入node -v
• git@2.8.1.windows.1 —— git命令行输入git version
• hexo@3.3.1 —— git命令行输入hexo -v或hexo version

搭建github博客

创建仓库

新建一个名为你的用户名.github.io的仓库，比如说，如果你的github用户名是test，那么你就新建test.github.io的仓库（必须是你的用户名，其它名称无效），将来你的网站访问地址就是 http://test.github.io 了，是不是很方便？

由此可见，每一个github账户最多只能创建一个这样可以直接使用域名访问的仓库。

几个注意的地方：

1. 注册的邮箱一定要验证，否则不会成功；
2. 仓库名字必须是：username.github.io，其中username是你的用户名；

创建成功后，以后你的博客所有代码都是放在这个仓库里啦。

配置SSH key（配置过的请跳过）

这一步骤在【Hexo搭建独立博客全纪录】（一）使用Git和Github4.1和4.2中也已讲过，如果在前面已经配置过SSH key，则可以跳过此步骤。

为什么要配置这个呢？因为你提交代码肯定要拥有你的github权限才可以，但是直接使用用户名和密码太不安全了，所以我们使用ssh key来解决本地和服务器的连接问题。

创建SSH Key

查看是否已经有ssh密钥：
打开用户主目录”C:\Users\Administrator.hp-PC”，
看看有没有.ssh目录。

• 如果有，再看看这个目录下有没有id_rsa和id_rsa.pub这两个文件。如果有，可以直接跳至下一小节“Github中添加SSH Key”
• 如果已经有ssh密钥，想要重新生成ssh密钥，需要清理原有ssh密钥：

  1 2 3

  $ mkdir key_backup $ cp id_rsa* key_backup $ rm id_rsa*

• 如果没有，打开命令行，输入命令ssh-keygen -t rsa –C “youremail@example.com”。此处的邮箱地址，你可以输入自己的邮箱地址。在回车中会提示你输入一个密码，这个密码会在你提交项目时使用，如果为空的话提交项目时则不用输入。这个设置是防止别人往你的项目里提交内容。

  由于我本地此前运行过一次，所以本地有，如下所示：

id_rsa是私钥，不能泄露出去，id_rsa.pub是公钥，可以放心地告诉任何人。由于之前使用Github客户端，因此还有github_rsa和github_rsa.pub两个文件。known_hosts文件如果没有暂时不管。

验证是否连接成功，连接成功显示Hi baoyuzhang! You've successfully authenticated, but GitHub does not provide shell access.。如下：

Github中添加SSH Key

登录github，点击个人头像打开”settings”，再打开”SSH and GPG keys”页面，然后点击”New SSH Key”，填上任意title，在”Key”文本框里黏贴id_rsa.pub文件的内容，点击 Add Key，你就应该可以看到已经添加的key。如下：

使用hexo博客框架

Hexo官方使用文档：https://hexo.io/zh-cn/docs/

本文使用的命令和官方文档不太一样，但意思相同，达到的效果也相同。初学者建议跟着本文一步一不做。

hexo简介

a.hexo是什么

Hexo是一个简单、快速、强大的基于 Github Pages 的博客框架，支持Markdown格式，有众多优秀插件和主题。

github: https://github.com/hexojs/hexo

Hexo中文官网： https://hexo.io/zh-cn/

b.hexo原理

由于github pages存放的都是静态文件，博客存放的不只是文章内容，还有文章列表、分类、标签、翻页等动态内容，假如每次写完一篇文章都要手动更新博文目录和相关链接信息，相信谁都会疯掉，所以hexo所做的就是将这些md文件都放在本地，每次写完文章后调用写好的命令来批量完成相关页面的生成，然后再将有改动的页面提交到github。

安装

a.注意事项

安装之前先来说几个注意事项：

1. 很多命令既可以用Windows的cmd来完成，也可以使用git bash来完成，但是部分命令会有一些问题，为避免不必要的问题，建议全部使用git bash来执行；
2. hexo不同版本差别比较大，网上很多文章的配置信息都是基于2.x的，所以注意不要被误导；
3. hexo有2种_config.yml文件，一个是根目录下的全局的_config.yml，一个是各个theme下的_config.yml。为了描述方便，在以下说明中，将前者称为 站点配置文件， 后者称为 主题配置文件。

b.安装Hexo

在git bush输入以下命令：

1

$ npm install -g hexo

初始化

a.初始化

在电脑的某个地方新建一个名为hexo的文件夹（名字可以随便取），比如我的是E:\web\github\test\hexo，由于这个文件夹将来就作为你存放博客代码的地方，所以最好不要随便放。

hexo会自动下载一些文件到这个目录，包括node_modules，目录结构如下图：

1
2
3
4
5
6
7
8

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

b.生成静态文件

执行以上命令之后，hexo就会在public文件夹生成相关html文件，这些文件将来都是要提交到github上你的用户名.github.io的仓库上去的：

c.本地预览

hexo s是开启本地预览服务，打开浏览器访问 http://localhost:4000 即可看到内容，Ctrl+C停止本地预览。

若浏览器一直在转圈但是就是加载不出来，或执行hexo s命令出现以下提示：

这一般情况下是因为4000端口占用的缘故，因为4000这个端口太常见了，解决端口冲突问题请参考这篇文章：

http://blog.liuxianan.com/windows-port-bind.html

第一次初始化的时候hexo已经帮我们写了一篇名为 Hello World 的文章，默认的主题比较丑，打开时就是这个样子：

更改主题

既然默认主题很丑，那我们别的不做，首先来替换一个好看点的主题。

• 官方主题：官方提供的各种主题

• 有哪些好看的 Hexo 主题? - 知乎

这里我推荐使用使用量排名第一的主题NexT。更换NexT主题可以参考NexT 官方使用文档，点击开始使用一步一步操作。下面做一个示范，并且下周写的优化设置的文章，也是基于NexT主题，可以跟着我一步一步来做。

a.下载主题

b.启用主题

打开根目录下站点配置文件_config.yml， 找到 theme 字段，并将其值更改为 next。

到此，NexT 主题安装完成。下一步我们将验证主题是否正确启用。

c.验证主题

在切换主题之后、验证之前， 我们最好使用 hexo clean 来清除 Hexo 的缓存，以免出现一些莫名其妙的问题。然后重新执行hexo g来重新生成。

使用hexo s本地预览，如果你的博客变为下图的样子，则安装NexT主题成功：

上传到github

a.配置站点配置文件

打开根目录下站点配置文件_config.yml，配置有关deploy的部分：

b.安装插件

此时，直接使用hexo d部署到github，将出现如下错误：

这是因为需要安装如下插件：

c.部署到github

其它命令不确定，hexo d部署这个命令一定要用git bash，否则会提示Permission denied (publickey).

中间好长的安装过程，然后安装成功：

这时，打开https://你的用户名.github.io/，出现下图，则表示部署到github成功：

再打开github仓库，已经有了内容：

基本配置

我们自己的博客出现Hello World并不是我们想要的，那么我们来进一步配置，将它真正我们自己的博客。

打开根目录下站点配置文件_config.yml，设置如下内容：

其中，description主要用于SEO，告诉搜索引擎一个关于您站点的简单描述，通常建议在其中包含您网站的关键词。author参数用于主题显示文章的作者。

配置完成后，重新部署，会发现如下变化：

但文章内容还不是我们自己的呀，下面来写我们自己的博客。

写博客

新建文章

执行hexo new '文章名'，hexo会帮我们在..\hexo\source\_posts下生成相关md文件：

打开这个文件就可以开始写博客了，默认生成如下内容：

当然你也可以直接自己新建md文件，用这个命令的好处是帮我们自动生成了时间。一般完整格式如下：

1
2
3
4
5
6
7
8
9

---
title: postName #文章页面上的显示名称，一般是中文
date: 2013-12-02 15:30:16 #文章生成时间，一般不改，当然也可以任意修改
categories: 默认分类 #分类
tags: [tag1,tag2,tag3] #文章标签，可空，多标签请用格式，注意:后面有个空格
description: 附加一段文章摘要，字数最好在140字以内，会出现在meta的description里面
---

以下是正文

删除hello-world.md，同时删除public文件夹下的hello-world文件夹：

将编写好的文章保存，重新生成和部署就可以啦！

新建页面

假如我新建一个名字为about的页面：

在source文件夹下，将生成about文件夹：

部署后将在public文件夹生成一个新的html页面：hexo\public\about\index.html，通过访问https://用户名.github.io/about/访问这个页面：

你可以通过编辑index.html，添加自己的简历等其他你想加入的内容。但注意，它是新建了一个html页面，不是文章，不会出现在博文目录。

至此，博客的基本功能已经全部实现，下面的高级配置，让你更加方便快捷的写博客！

高级配置

现在，Hexo根目录结构如下图：

1
2
3
4
5
6
7
8
9
10

.
├── _config.yml
├── db.json
├── package.json
├── public
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

下面介绍的几个是会经常用到的：

_config.yml

网站配置信息，也就是本文所称的站点配置文件，可以在此配置大部分的参数。基本配置在前面基本已经设置过了。

scaffolds

模版文件夹。新建文章时，Hexo 会根据 scaffold 来建立文件。

Hexo的模板是指新建的markdown文件中默认填充的内容。例如，在使用hexo new 文章名时，默认生成的md文件会包含如下内容：

默认内容是哪里来的呢？就在scaffold/post.md中保存：

假如对每篇博客我都需要添加分类categories，每次都手动添加太麻烦，我希望每次默认生成都有categories:，那么就可以在scaffold/post.md中添加：

保存后，每次新建一篇文章时都会包含post.md中的内容。

当然，你也可以在scaffolds文件夹下创建自己的博客模板，我创建一个名为blog的模板：

通过如下命令调用我创建的blog模板新建文章：

在_posts中生成md文件：

public

该文件夹中的内容将被最终push到github仓库中。

source

资源文件夹是存放用户资源的地方。除_posts 文件夹之外，开头命名为 _ (下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹，而其他文件（如刚刚生成的about文件夹）会被拷贝到 public 文件夹。

为github仓库添加readme

既然 source 文件夹中的内容将全部被推送到 public 文件夹，public 文件夹中的内容又将被最终push到github仓库中，那么如果我们想要为github仓库添加readme.md，只要在 source 文件夹中创建就好了：

部署到github，就有readme了，但我们发现，README.md已经被解析为README.html，显示的全是html代码，并不是我们想要的文档格式的内容：

为了解决这个问题，我们回到source文件夹，将README.md重命名为README.MDOWN，再部署到github：

source文件夹中，.md会被解析为html，并放到 public 文件夹被push到github，但.MDWN不会被解析。

themes

主题文件夹，下载的主题都保存在此文件夹下。Hexo 会根据主题来生成静态页面。

最终效果

点击查看最终效果

搭的这个博客只是为了写这篇文章，我真正的博客在这里哟！

Hexo常用命令

常用命令

1
2
3
4
5
6

hexo new "postName" #新建文章
hexo generate #生成静态页面至public目录
hexo server #开启预览访问端口（默认端口4000，'ctrl + c'关闭server）
hexo deploy #部署到GitHub
hexo help  # 查看帮助
hexo version  #查看Hexo的版本

缩写：

1
2
3
4

hexo n == hexo new
hexo g == hexo generate
hexo s == hexo server
hexo d == hexo deploy

组合命令：

1
2

hexo s -g #生成并本地预览
hexo d -g #生成并上传

Hexo是基于Github的博客平台，Github中的文本格式是.md，那么用Hexo写博客也必然要用到Markdown。本文首先带你选择适合你的Markdown编辑器(推荐Atom)，然后对Markdown语法做一简要介绍。

Markdown编辑器

支持Markdown的编辑器有好多，功能也不完全一致，有的是用来进行基本的写作，有的是用来写代码的，有的甚至只是博客平台配套的编辑器。想了解好用的Markdown编辑器，可以点开链接。

根据我个人的需求，我使用Atom作为本地Markdown编辑器，使用简书发布文章，与我的博客同步更新。这里要安利一波Atom！

Atom 介绍

Atom，Github出的编辑器，支持各种编程语言，拥有和Sublime类似的丰富插件，同时结合了Markdown本地预览功能，打开github仓库还能显示各文件的状态。除此之外，颜值还高啊！默认高亮就很好看，深深吸引了颜控的我。Atom简直就是一款取代Sublime的神器！总而言之，作为一个前端程序员，日常的敲代码，用Git和Github版本控制，Markdown写博客，有Atom就够了！

Atom预览Markdown快捷键：Ctrl+Shift+M

关于Atom的用法，不属于本文内容，这里只附上链接：

• Atom 介绍
• Atom基础使用
• Atom 安装包国内镜像
• FAQ、官方博客/手册索引、插件推荐专题

Markdown语法介绍

• 献给写作者的 Markdown 新手指南：必推的小白入门教程，跟着做一遍就可以上手写文章啦~
• Markdown 语法说明(简体中文版)：进阶教程，分为快速入门和完整语法说明两版，给web开发者的Markdown教程，需要有HTML基础
• 本文的Markdown语法介绍

段落元素

1、段落与换行

Markdown 中的段落指连续的一段文字，编写时段落之间用至少一个空行隔开，段落内多个空格将被视为一个空格，段首不支持缩进。

如果想要在显示时显示多个空行，可以插入 <br/> 来实现，注意的是，插入的 <br/> 应与前后的段落中间至少空一行。

2、标题

Markdown 支持两种类型的标题。

//类型 1这是一级标题==========这是二级标题----------//类型 2# 这是一级标题## 这是二级标题...###### 这是六级标题

从上面可以看出类型 1 是在标题下面插入 = 或者 - 来标识标题等级，但局限是其只能表示两个级别的标题。

类型 2 是在标题前面插入 1 - 6 个 # ，表示 6 个等级的标题，这是比较推荐的用法。

3、引用

Markdown 中使用 > 来引用。我们可以在一段文字中的每行开头加上 > 来表示一段引用文字，也可以只在一段文字的开头插入一个 > 来表示，如下面的 1、2 两种方式：

1
2
3
4
5
6
7

//方式 1
> 这是一句话
> 这是第二句话

//方式 2
> 这是一句话
这是第二句话

Markdown 支持使用不同数量的 > 表示嵌套引用。

1
2

> 这是外层的引用
> > 这是内层的引用

4、无序列表

无序列表使用 -、 + 或 * 来作为标记。

1
2
3

- 第一项
- 第二项
- 第三项

上面的 - 可以用 +、 *替换。需要注意的是，- 等符号与后面的文字至少空一格空格。

5、有序列表

有序列表使用数字和紧挨着的点号表示。

1
2
3

1. 第一项
2. 第二项
3. 第三项

同无序列表一样，标记符号与后面的文字至少空一格空格。但编辑时的数字对显示无影响。

1
2
3

2. 第一项
6. 第二项
1. 第三项

上面的例子与前一个显示的结果完全一致，但建议编辑时按照数字顺序。

列表

• 有序列表和无序列表的每一项中均可嵌套其他列表；

• 在列表项之间要插入段落时，这时需要将列表项之间的段落缩进 4 个空格；

• 使用 1\. 来输出 1.;

6、代码区块

缩进 4 个空格，需要注意的是，每行代码都需要至少缩进 4 个空格，不能像段落一样采用首行标记的偷懒写法，一个代码区会一直持续到没有缩进 4 个空格的那一行。

也可以用一对三个连续的撇号 ` 来包裹代码段。

1
code

有的解释器还能根据代码的语言从而给代码加上语法高亮。

1
function func() {}

7、分割线

使用三个及以上的 *、 - 或 _来表示一个分割线，符号不能混用，符号之间可以插入多个空格。需要注意的是，使用 - 来插入分割线时需要与上一个段落至少空一行，否则 Markdown 会将上一行文字解释为二级标题。

8、表格

表格是 Markdown 比较复杂的一种表示。

| Table | Col1 | Col2 || ----- |:----:| ----:|| Row1  | 1-1  | 1-2  || Row2  | 2-1  | 2-2  || Row3  | 3-1  | 3-2  |

上面第二行中的点代表对齐方式，分别是默认（居右）、居中、居左。

行内元素

9、超链接

Markdown 中有三种方式实现超链接。

//方式 1[百度](http://www.baidu.com)//方式 2[百度][Baidu-url][Baidu-url]: http://www.baidu.com

方式 1 较为常用，也可以为链接的文字加上提示文字，只要在括号中超链接加上空格后添加提示内容即可。

[百度](http://www.baidu.com "这是提示文字")

方式 2 由链接文字和链接地址组成，不同的是两者均由 [] 包裹。链接地址的格式为：

• 方括号，里面输入链接地址；
• 紧接着是一个冒号；
• 冒号后面至少一个空格；
• 链接地址；
• 若有提示文字，空格后用引号或者括号包裹提示文字。

下面是完整示例：

1
2

[百度][Baidu-url]
[Baidu-url]: http://www.baidu.com "这是提示文字"

第三种方式是用 <> 来包裹 URL。

//方式 3<http://www.baidu.com>

10、加粗和斜体

Markdown 使用 * 和 _ 来表示粗体和斜体。

//加粗**这是加粗文字**__这也是加粗文字__//斜体*这是斜体文字*_这也是斜体文字_

被偶数个 * 或 _ 包裹的文字显示加粗效果，被奇数个包裹的为倾斜效果。

需要注意的是，* 和 - 要成对出现，不能混合使用，也不能只出现一个。同时，标识符号要与标识的文字紧挨着，符号与符号之间、符号文字之间不能有任何空格。

11、代码

使用 ` (撇号) 来包裹一小段代码。

`Hello world.`

若想在代码中添加撇号，可以使用多个撇号包裹里面需要添加的撇号，但注意里面的连续的撇号数量不能超过外面的数量。

//显示一个撇号`` ` ``

12、图片

图片的插入方式跟超链接前两种插入方式类似。

//方式 1![如果图片不能显示，就显示这段文字](图片 url)//方式 2![如果图片不能显示，就显示这段文字][Image-url][Image-url]: 图片url "这是提示文字"

反斜杠 \

我们经常需要在文章中插入一些特殊符号，而这些符号恰好是前面所讲的标识符号，可以在特殊符号前插入 \ 来直接显示符号，而不让 Markdown 来将其解释为标识符号。

Markdown 支持以下这些符号前插入 \ 而显示其本来样子：

1
2
3
4
5
6
7
8
9
10
11
12

\   反斜线
`   反引号
*   星号
_   底线
{}  花括号
[]  方括号
()  括弧
#   井字号
+   加号
-   减号
.   英文句点
!   惊叹号

拓展

其实，市场上有很多的 Markdown 解释器，它们大都能支持上面所讲的语法，但呈现出的样式往往不一。另外，不同的解释器还能支持其他自己定义的语法，比如 Github 还能支持 emoji。下面再着重介绍 Github 支持的几个 Markdown 语法。不过需要注意的是，有些语法只能在 issue 或者 pull request 上使用，这个在后面讲每个语法时会标记（约定：“通用”表示在 Github 任何地方可以使用的语法，“特殊”表示只能在 issue 或者 pull request 上使用）。

语法高亮(通用)

上面说过，有的解释器是能够显示语法高亮的，Github 就可以。

任务列表（通用）

- [ ] task one- [x] task two

用法跟普通列表的用法差不多，只不过在每一项文字前面加了 [ ] 或者 [x]。[ ] 中间有且只有一个空格，表示未完成，另一个表示已完成。

表格（通用）

Github 支持更简单的 table 语法。

1
2
3
4

First Header | Second Header
------------ | -------------
Content from cell 1 | Content from cell 2
Content in the first column | Content in the second column

表头与项用一排 - 分隔开，每一列用 | 分隔开。

SHA 引用（特殊）

每一次 commit 都会产生一个 id，用 @id 的方式可以链接到某个项目的特定的 commit。比如用 jquery/jquery@1b9575b9d14399e9426b9eacdd92b3717846c3f2 就能链接到 jquery 的一次 commit 记录上。

issue 引用（特殊）

用 #1 来引用当前 repo 的第一个 issue，也可以用 jquery/jquery#1 引用 jquery 的第一次 issue。

@（特殊）

用 @ 来提醒目标用户。比如 @CompileYouth 可以 @ 到我。

删除符号（通用）

用连续两个 ~ 包围的词会被加上删除符。比如 ~~This is removed~~。

Emoji（通用）

Github 比较有意思的是可以支持 emoji。比如 :smile: 表示笑脸等等，具体可以查看 Emoji Cheat Sheet

详细信息可以查看官方文档。最后 po 两张 Github 官方推荐的 Markdown Cheat Sheet：通用语法，Github 支持语法

去年十月第一次接触Github，慕名而来，当时觉得这是一个高的触不可及的平台，我等渣渣还是退下吧…直到今年过完年回来二月份才开始真正使用Github，不熟悉命令行的我对Git Bush是绕着走的，在慕课网上看到Github可以使用友好的图形化客户端来操作，心中一阵窃喜。现在看来，当时真是too young too simple，因为命令行真的是好用啊！而且一点都不难，so easy~当初用客户端还把自己搞得晕晕乎乎的，当时在想这东西这么复杂怎么还这么火，还怀疑自己是不是不适合做程序员…本以为自己走了捷径，却害苦了自己！好了，闲话到此为止，进入正题。

结论：拒绝客户端，直接学习Git！

学习Git和Github，我主要是跟着Git使用教程来做的，文中每一步都有图和解释，超详细，手把手教你使用Git和Github，极力推荐给正在入门的小白！参考该教程、文后的链接和我自己的理解，构成本文的内容。由于目前个人用不到多人协作，因此本文并未提及，如有需要，也请参考Git使用教程。

此处列出了一些我收藏的公认的比较好的Git教程，可以作为深入学习资料

• Git使用教程 本文主要参考

• Git教程 - 廖雪峰的官方网站 大牛博客，还包含JS，Python等教程，都很棒

• git 使用简易指南

• 图解Git 图文并茂，对git工作原理的理解帮助很大

• Git - Book

• GitHub Guides GitHub官方指南，很多都有中文翻译，可以自己搜一下

• 理解 GitHub Flow · GitHub 指南 理解Github工作原理，GitHub官方指南中文翻译的一部分

Git简介

Git是什么？

Git是目前世界上最先进的分布式版本控制系统。

SVN（集中式）与Git（分布式）的最主要的区别？

SVN是集中式版本控制系统，版本库集中放在中央服务器。干活的时候用自己的电脑，首先要从中央服务器哪里得到最新的版本，然后干活，干完后把自己做完的活推送到中央服务器。集中式版本控制系统必须联网才能工作，如果在局域网还可以，带宽够大，速度够快，如果在互联网下，如果网速慢的话，就难办了。

Git是分布式版本控制系统，没有中央服务器。每个人的电脑就是一个完整的版本库，工作的时候不需要联网。既然每个人的电脑都有一个完整的版本库，那多个人如何协作呢？比如说自己在电脑上改了文件A，其他人也在电脑上改了文件A，这时，你们俩只需把各自的修改推送给对方，就可以互相看到对方的修改了。

安装Git（windows）

安装

建议到Git官网下载最新版本，国内访问会很慢，可以到网上搜索下载，然后默认安装即可。安装完成后，在开始菜单里面找到 “Git –> Git Bash”，如下：

弹出一个类似的命令窗口的东西，就说明Git安装成功。如下：

设置用户名和邮箱

因为Git是分布式版本控制系统，所以需要填写用户名和邮箱作为一个标识。在命令行输入如下：

注意！git config --global 参数，表示你这台机器上所有的Git仓库都会使用这个配置，当然你也可以对某个仓库指定的不同的用户名和邮箱。

查看已设置的用户名和邮箱，在命令行输入如下：

使用Git

创建版本库repository

版本库：又名仓库，英文名repository。可简单的理解一个目录，这个目录里面的所有文件都会被Git管理，每个文件的修改，删除，Git都能跟踪，以便任何时刻都可以追踪历史，或者在将来某个时刻还可以将文件“还原”。

打开所在目录

创建一个版本库，如在D:/www下 目录下新建一个testgit版本库，在命令行输入如下：

初始化：将当前目录变为git仓库

注意！ 这时当前testgit目录下会多一个.git的目录，这个目录是Git来跟踪管理版本的，千万不要手动乱改这个目录里面的文件，否则，会把git仓库给破坏了。如下：

添加文件到版本库

作为测试，在当前目录下新建一个readme.txt，并写入11111111保存，之后进行如下3步操作：

git status 结果显示没有任何文件未提交。

修改和版本回退

修改文件内容

继续，修改readme.txt内容，在下面添加一行22222222内容，继续使用git status查看结果，如下：

结果显示，readme.txt文件已被修改，但是未被提交的修改。接下来我想看下readme.txt文件到底改了什么内容，如何查看呢？可以使用如下命令：

结果显示，readme.txt文件内容从一行11111111改成两行，添加了一行22222222内容。

知道了对readme.txt文件做了什么修改后，我们可以放心的提交到仓库了，提交修改和提交文件是一样的两步(第一步是git add 第二步是：git commit)。如下：

git status：提交文件之前，查看一下状态；提交文件之后，继续查看一下状态，显示没有可提交的文件

说明： 所有的版本控制系统，只能跟踪文本文件的改动（如txt文件，网页，所有程序的代码等）。对于图片，视频这些二进制文件，只能把每次改动串起来，无法跟踪文件的变化，即：知道图片从1kb变成2kb，但是到底改了什么，版本控制系统也不知道

查看历史记录

继续对readme.txt文件进行修改，再增加一行
内容为33333333，然后执行命令如下：

现在我已经对readme.txt文件做了三次修改了，那么我现在想查看下历史记录，如何查看呢？使用命令 git log ,如下：

结果显示，从最近到最远的显示日志，我们可以看到最近三次提交，最近的一次是“增加333内容”，上一次是“增加222内容”。

如果嫌上面显示的信息太多的话，可以用缩减版显示，如下：

版本回退

现在我想使用版本回退操作，我想把当前的版本回退到上一个版本，要使用什么命令呢？可以使用如下2种命令，第一种是git reset --hard HEAD^ ；那么如果要回退到上上个版本只需把HEAD^ 改成 HEAD^^， 以此类推。那如果要回退到前100个版本的话，使用上面的方法肯定不方便，我们可以使用下面的简便命令操作：git reset --hard HEAD~100 即可。未回退之前的readme.txt内容如下：

回退到上一个版本，如下

查看现在readme.txt文件中的内容，如下：

结果显示，”增加333内容”我们没有看到了。

恢复最新版本

现在我想恢复到最新的版本(有333333内容版本)要如何恢复呢？可以通过版本号回退。

但是现在的问题假如我已经关掉过一次git bush，或者333内容的版本号我并不知道呢？要如何知道增加3333内容的版本号呢？如下：

结果显示，”增加333内容”的版本号是 c83a6bb。现在可以通过版本号回退了，如下：

结果显示，目前已经是最新的版本。

理解工作区、暂存区、版本库

工作区： 你在电脑上看到的目录，比如目录testgit里的文件(.git隐藏目录版本库除外)，以后需要再新建的目录文件等等都属于工作区范畴。

版本库： 工作区里的隐藏目录.git，这个不属于工作区，这是版本库。版本库中存了很多东西：

• 暂存区(stage) ——最重要！（暂存区是版本库的一部分）
• Git为我们自动创建了第一个分支master
• 指向当前分支的指针HEAD

前面说过使用Git提交文件到版本库有两步：

• 第一步：git add 把文件添加进去，实际上就是把文件添加到暂存区；

• 第二步：git commit 提交更改，实际上就是把暂存区的所有内容提交到当前分支上。

下面来举例说明。

在readme.txt再添加一行内容为4444444，接着在目录下新建一个文件为test.txt 内容为test，我们先用命令git status来查看下状态，如下：

先使用git add 命令把2个文件都添加到暂存区中，再使用git status来查看下状态，如下：

接着使用git commit一次性提交到分支上，如下：

撤销修改、删除和恢复文件

撤销修改

现在在readme.txt文件里面增加一行内容为55555555，通过命令查看如下：

在未提交之前，我发现添加55555555内容有误，得马上恢复以前的版本，现在我可以有如下几种方法可以做修改：

1. 如果知道要删掉哪些内容，直接手动更改去掉那些需要的文件，然后add添加到暂存区，最后commit。

2. 按以前的方法直接恢复到上一个版本。使用 git reset --hard HEAD^

但是现在我不想使用以上两种方法，想直接使用撤销命令该如何操作呢？首先在做撤销之前，我们可以先用 git status 查看下当前的状态，如下：

可以发现，Git会告诉你，git checkout -- file 可以将工作区做的修改全部撤销，如下:

注意： git checkout -- readme.txt 中的 -- 很重要.如果没有 -- ，则命令变成创建分支了。

结果显示，内容555已结没有了。将工作区做的修改全部撤销有两种情况：

1. 修改后还没有放到暂存区：撤销修改则回到和版本库一模一样的状态；
2. 已经放入暂存区，接着又作了修改：撤销修改则回到添加暂存区后的状态。

对于第2种情况，继续做demo，假如现在对readme.txt添加一行内容为66666666，git add 增加到暂存区，如下：

接着添加内容77777777，通过撤销命令让其回到暂存区后的状态。如下：

删除和恢复文件

假如现在版本库testgit目录添加一个文件a.txt，然后提交。如下：

一般情况下，删除文件有两种方法：

1. 直接在文件目录中删除文件text.txt
2. 使用命令rm a.txt

如下：

当前目录是这样的:

如果想彻底从版本库中删掉了此文件的话，可以再执行commit命令提交掉。没有commit之前，想在版本库中恢复此文件如何操作呢？如下：

再来看testgit目录，添加了2个文件，如下：

创建、合并分支

理解HEAD和master指针

你已经知道，在版本回退里，每次提交，Git都把它们串成一条时间线，这条时间线就是一个分支。截止到目前，只有一条时间线，在Git里，这个分支叫主分支，即master分支。严格来说，HEAD并不是指向提交，而是指向master，master才是指向提交的，所以，HEAD指向的就是当前分支。

结论：HEAD指向当前分支，master指向提交

理解分支管理策略

master主分支：用来发布新版本，应该是非常稳定的。一般情况下不允许在上面干活。
一般情况下在新建的dev分支上干活，干完后，要发布，或者说dev分支代码稳定后可以合并到主分支master上来。

创建、合并分支

首先，我们来创建并切换到dev分支上，然后查看当前分支，如下：

git checkout -b xxx表示创建 + 切换分支，相当于git branch xxx和git checkout xxx。

git branch表示查看分支，列出所有分支，当前分支前有星号。

首先我们来查看下readme.txt内容，接着添加内容77777777，再次查看内容并提交，如下：

dev分支工作已完成，现在切换到主分支master上，继续查看readme.txt内容，如下：

我们发现内容777不见了，因为已经由dev分支切换到主分支了，主分支并没有增加777内容。现在我们把dev分支上的内容合并到分支master上，在master分支上，使用git merge dev，继续查看内容。如下：

我们发现多了一条777，和dev分支最新的提交完全一样。

注意！ merge后显示的Fast-forward信息，表示这次合并是“快进模式”，即，直接把master指向dev的当前提交，合并速度非常快。

合并完成后，可以删除dev分支，如下：

查看分支，发现只剩下主分支master了。

解决冲突

那么如何解决冲突呢？我们还是一步一步来，先新建一个新分支fenzhi1，在readme.txt添加一行内容8888888，然后提交，如下：

接着切换到master分支上，在最后一行添加内容99999999，如下：

现在，在master分支上合并fenzhi1，如下：

发现发生了冲突CONFLICT，git bush中显示分支的地方也变成了(master|MERGING)。查看状态和readme.txt内容，如下：

Git用<<<<<<<，=======，>>>>>>>标记出不同分支的内容。

• <<<HEAD ：主分支修改的内容
• >>>>>fenzhi1 ：fenzhi1上修改的内容

修改readme.txt内容后，保存并提交，如下：

发现显示分支的地方变回了(master)。如果想要查看分支合并的情况，需要使用命令 git log命令，如下：

git log展示的信息量太大，一片文字看不过来，使用git log --graph --pretty=oneline --abbrev-commit命令可以显示分支合并图，如下：

“Fast forward”模式 no-ff

通常合并分支时，git一般使用”Fast forward”模式，在这种模式下，删除分支后，会丢掉分支信息。

现在我们来使用带参数 –no-ff来禁用”Fast forward”模式。来做demo演示下：

1. 创建一个dev分支
2. 修改readme.txt内容，增加aaa
3. 添加到暂存区
4. 切换回主分支(master)
5. 合并dev分支，使用命令 git merge -–no-ff -m “注释” dev
6. 删除dev分支
7. 查看分支
8. 查看历史记录

如下：

bug分支

在开发中，会经常碰到bug问题，那么有了bug就需要修复，在Git中，分支是很强大的，每个bug都可以通过一个临时分支来修复，修复完成后，合并分支，然后将临时的分支删除掉。

来做demo演示：新建dev分支，在readme.txt中增加bbb。此时接到一个404 bug，我们可以创建一个404分支来修复它，但是，当前的dev分支上的工作还没有提交。如下：

并不是我不想提交，而是工作进行到一半时候，我们还无法提交，比如我这个分支bug要2天完成，但是我issue-404 bug需要5个小时内完成。怎么办呢？还好，Git还提供了一个stash功能，可以把当前工作现场 ”隐藏起来”，等以后恢复现场后继续工作。如下：

查看状态显示，nothing to commit, working directory clean，说明工作现场已被隐藏。现在可以通过创建issue-404分支来修复bug了。

首先要确定在哪个分支上修复bug。假设我现在要在主分支master上修复，那么要切换到主分支master，然后创建一个临时分支issue-404，如下：

修复404bug：将最后一行aaa改为404fixed，然后提交，如下：

修复完成，切换到master分支上，并完成合并，最后删除issue-404分支。如下：

现在，可以回到dev分支上干活了。

查看状态表明，现在的工作区是干净的。那么我们工作现场去哪里呢？我们可以使用命令 git stash list来查看下。如下：

工作现场还在，Git把stash内容存在某个地方了，但是需要恢复一下，可以使用如下2个方法：

1. git stash apply恢复。恢复后，stash内容并不删除，你需要使用命令git stash drop来删除
2. 使用git stash pop。恢复的同时把stash内容也删除了

如下：

这样就恢复了之前的工作区，可以继续dev分支的工作了。

Github远程仓库

先注册github账号，由于你的本地Git仓库和github仓库之间的传输是通过SSH加密的，所以需要设置SSH Key。

创建SSH Key

查看是否已经有ssh密钥：
打开用户主目录”C:\Users\Administrator.hp-PC”，
看看有没有.ssh目录。

• 如果有，再看看这个目录下有没有id_rsa和id_rsa.pub这两个文件。如果有，可以直接跳至下一小节
• 如果已经有ssh密钥，想要重新生成ssh密钥，需要清理原有ssh密钥：

  1 2 3

  $ mkdir key_backup $ cp id_rsa* key_backup $ rm id_rsa*

• 如果没有，打开命令行，输入命令ssh-keygen -t rsa –C “youremail@example.com”。此处的邮箱地址，你可以输入自己的邮箱地址。在回车中会提示你输入一个密码，这个密码会在你提交项目时使用，如果为空的话提交项目时则不用输入。这个设置是防止别人往你的项目里提交内容。

  由于我本地此前运行过一次，所以本地有，如下所示：

id_rsa是私钥，不能泄露出去，id_rsa.pub是公钥，可以放心地告诉任何人。由于之前使用Github客户端，因此还有github_rsa和github_rsa.pub两个文件。known_hosts文件如果没有暂时不管。

验证是否连接成功，连接成功显示Hi baoyuzhang! You've successfully authenticated, but GitHub does not provide shell access.。如下：

Github中添加SSH Key

登录github，点击个人头像打开”settings”，再打开”SSH and GPG keys”页面，然后点击”New SSH Key”，填上任意title，在”Key”文本框里黏贴id_rsa.pub文件的内容，点击 Add Key，你就应该可以看到已经添加的key。如下：

添加远程库

先创建本地git仓库，再创建github仓库，两个仓库同步

现在的情景是：我们已经在本地创建了一个Git仓库后，又想在github创建一个Git仓库，并且希望这两个仓库进行远程同步，这样github的仓库可以作为备份，又可以其他人通过该仓库来协作。

首先，登录github上，然后在右上角点击”+”找到”New repository”创建一个新的仓库。如下：

在Repository name填入testgit，其他保持默认设置，点击“Create repository”按钮，就成功地创建了一个新的Git仓库：

目前，在GitHub上的这个testgit仓库还是空的。现在把已有的本地仓库testgit与之关联，然后，把本地仓库的内容推送到GitHub仓库。

把本地库的内容推送到远程，使用 git push命令，实际上是把当前分支master推送到远程。

由于远程库是空的，我们第一次推送master分支时，加上了 –u参数，Git不但会把本地的master分支内容推送的远程新的master分支，还会把本地的master分支和远程的master分支关联起来，在以后的推送或者拉取时就可以简化命令。推送成功后，可以立刻在github页面中看到远程库的内容已经和本地一模一样了：

从现在起，只要本地作了提交，通过命令git push origin master就可以把本地master分支的最新修改推送到github上了，现在你就拥有了真正的分布式版本库了。

先创建github仓库，再从github仓库克隆

上面我们了解了先有本地库，后有远程库时候，如何关联远程库。现在我们想，假如远程库有新的内容了，我想克隆到本地来 如何克隆呢？

首先，登录github，创建一个新的仓库，名字叫testgit2.如下：

现在，远程库已经准备好了，下一步是使用命令git clone克隆一个本地库了。如下：

在本地目录就生成了testgit2目录，如下：

Git常用指令