1.配置用户名和邮箱：

git config --global user.name "名字（英文）" git config --global user.email "邮箱（常用）"

注意：此用户名和邮箱是git提交代码时用来显示你身份和联系方式的。

2.生成密钥对

git支持两种传输协议：

https协议，每次pull, push都会提示要输入密码;
git协议，使用ssh密钥，这样免去每次都输密码的麻烦.

检查本机是否有ssh key设置，默认储存在账户的主目录下的 ~/.ssh 目录
cd ~/.ssh 没有则提示： No such file or directory；有则会进入到 ~/.ssh 路径下 ls 查看当前路径中的文件
rm * 删除所有文件（如果需要清空） ssh-keygen -t rsa -C "邮箱（常用）" 生成密钥对
（可生成ssh key自定义名称的密钥，默认id_rsa。）
$ ssh-keygen -t rsa -C "邮箱（常用）" -f ~/.ssh/自定义名称

提示：生成密钥对过程中的操作：
Generating public/private rsa key pair.
Enter file in which to save the key (/c/Users/xxxx_000/.ssh/id_rsa):

不填直接回车

Enter passphrase (empty for no passphrase):

输入密码（可以为空）

Enter same passphrase again:

再次确认密码（可以为空）

3.添加ssh key到GItHub

4.测试ssh keys是否设置成功
过程中的操作：
Are you sure you want to continue connecting (yes/no)? yes

确认你是否继续联系，输入yes

Enter passphrase for key '/c/Users/xxxx/.ssh/id_rsa':

生成ssh kye是密码为空则无此项；

若设置有密码则有此项且，输入生成ssh key时设置的密码。
Hi xxx! You've successfully authenticated, but GitHub does not provide shell access. #出现词句话，说明设置成功。

三、Git使用
1.命令说明：
【查看操作指令的历史】
History
【库】
git remote/git remote show 查看当前配置所有远程库，列出远程库名
git remote –v / git remote --verbose 列出所有远程仓库名和对应的克隆地址
git remote show <repositories name> 查看某个远程仓库的详细信息
git remote add <repositories name> <repositories url> 增加远程库（一个本地库可以对应多个远程库）
【分支】
git branch 查看所有本地分支
git branch –r 查看所有远程分支
git branch –a 查看所有本地和远程分支，远程分支用红色标注
git branch –v 查看本地各分支最后一个提交对象的信息
git branch –d <branch name> 删除指定分支
git branch –D <branch name> 强制删除指定分支
【获取远程库的更新】
git fetch 取回默认远程库所有已拥有的本地分支的更新。
git fetch <repositories name> 取回指定远程库所有已拥有的本地分支的更新。
git fetch <repositories name> <branch name> 取回指定远程库的指定分支的更新
2.案例工作流
【初始化项目创建本地仓库，关联远程仓库并上传（github）】
github创建新项目仓库（名字与本地仓库相同，并且不生成README.md）
git init 创建本地仓库, 生成.git目录 git remote add origin <repositoriesUrl> 关联远程仓库
git add . 将所有文件添加到暂存区（索引库） git commit –m'commit tip' 将暂存区中所有文件添加到本地仓库，并备注提交信息
git push -u origin master 将本地文件推送到远程仓库origin的分支master （-u选项会指定一个默认分支，以后就可以不加任何参数使用git push） 【克隆远程仓库到本地（当前路径下），并本地创建分支】 git clone -b branchName repositoriesUrl
（-b参数可以指定本地创建的分支名，不指定默认使用master分支）
【个人单独开发上传代码】
git status 查看本地状态，显示有变动的文件 git checkout -- 文件名字和后缀 将文件改动恢复，撤销修改
git add . 将所有文件添加到暂存区（索引库） git commit –m'备注' 将暂存区文件添加到本地仓库，并备注提交信息
git push origin 指定的分支 将本地文件推送到远程仓库origin中指定的分支 【团队协同开发上传代码】 git status 查看本地状态，显示有变动的文件
git checkout -- 文件名字和后缀 将文件改动恢复，撤销修改 git fetch 更新代码
git stash 隐藏修改的代码 git checkout 主分支 切换分支
git pull origin 主分支 更新最新的代码 git checkout - 返回自己的分支
git merge 主分支 要合并的分支 合并分支 git stash pop 取消隐藏
git add . 将所有文件添加到暂存区（索引库） git commit –m'备注' 将暂存区文件添加到本地仓库，并备注提交信息
git push origin 自己的分支 将本地文件推送到远程仓库origin的自己的分支 【回退历史版本】 git log 查看所有的历史版本，获取某个历史版本的id，
git reset --hard 回退版本到指定id git push -f -u origin master 把修改推到远程服务器

【使用】

【node.js 、 npm安装、配置 和 使用】
一、安装Node.js和npm（新版的NodeJS已经集成了npm）

二、npm配置
1.配置npm的全局模块的存放路径以及cache的路径：
路径自定义，如果路径为C盘下某些路径，可能会出现权限问题，可将该路径文件夹的用户权限修改为完全控制即可
npm config set prefix “xxx\node_global” npm config set cache “xxx\node_cache”
2.修改环境变量
增加NOEDE_PATH(全局变量模块存放位置)：
“我的电脑”右键“属性”-“高级系统设置”-“高级”-“环境变量”
系统变量下新建”NODE_PATH”，输入” xxx\node_global\node_modules”，
用户变量下”PATH”修改为“xxx\node_global\”，否则使用module的时候会导致输入命令出现“xxx不是内部或外部命令，也不是可运行的程序或批处理文件”这个错误。
3.修改npm的服务地址为淘宝
npm config set registry https://registry.npm.taobao.org 三、npm使用 及 较难安装的依赖安装教程 1.npm使用 npm install module-name 安装需要添加的依赖
save-dev 和 -save的说明
npm install module-name –save 添加模块和版本号到dependencies部分，一般用于发布时的依赖。 npm install module-name -save-dve
添加模块和版本号到devdependencies部分，一般用于开发时的依赖。

保存至package.json是因为node插件包相对来说非常庞大，所以不加入版本管理，将配置信息写入package.json并将其加入版本管理，其他开发者对应下载即可（命令提示符执行npm install，则会根据package.json下载所有需要的包，npm install --production只下载dependencies节点的包）。
2.node-sass
$ npm install --save node-sass --registry=https://registry.npm.taobao.org --disturl=https://npm.taobao.org/dist --sass-binary-site=http://npm.taobao.org/mirrors/node-sass
说明：
--registry=https://registry.npm.taobao.org 淘宝npm包镜像
--disturl=https://npm.taobao.org/dist 淘宝node源码镜像，一些二进制包编译时用
--sass-binary-site=http://npm.taobao.org/mirrors/node-sass 这个才是node-sass镜像
3.phantomjs
下载：phantomjs-2.1.1-windows.zip （链接：http://phantomjs.org/download.html）
解压并重命名：路径\phantomjs
添加环境变量：在“系统变量”选项区域中查看PATH变量，如果不存在，则新建变量 PATH，
否则选中该变量，单击“编辑”按钮，在“变量值”文本框的起始位置添加 D:\phantomjs\bin，开始-运行-输入cmd，输入 phantomjs --version，如果可以看到版本号，则安装成功。

【vue-cli(脚手架)搭建项目环境】
一、全局安装vue-cli(脚手架)
npm install -g vue-cli 二、使用模板快速搭建项目环境（推荐使用webpack项目模板）、进入项目文件夹 vue init <templateName> <projectName>
cd 说明：templateName - 项目模板名称 projectName – 项目名称:可要可不要，区别在于，带上名字vue会在你选的盘符下创建一个以你输入的名字创建一个文件夹，而不加，会询问你是否在当前目录下创建 官方模板： 基于vue cli和webpack的项目模板：webpack 、 webpack-simple ；（两者区别：跳转） 基于vue cli和browserify的项目模板： browserify 、 browserify-simple ；（不做对比） 其他项目模板： pwa 、 simple ；（暂作了解） 说明：对于 webpack 和 browserify 这两种类型的项目模板分别提供了简单模式和完全模式。 简单模式仅包含基于vue.js开发必要的一些资源和包，使用该模式可以快速地投入到开发。 完全模式则还包括ESLink、单元测试等功能。 三、安装项目模板中默认添加的依赖 npm install 该指令安装项目模板默认的依赖
四、运行项目
$ npm run dev 该指令运行项目并打开默认浏览器

【lib-flexible + px2rem - 移动端适配】
一、配置 flexible
方法一：
步骤1：安装 lib-flexible ：
$ npm i lib-flexible --save

步骤2：在项目入口文件 main.js 里 引入 lib-flexible :
import 'lib-flexible'

步骤3：在项目根目录的 index.html 中添加如下 meta
<meta name="viewport" content="width=device-width, initial-scale=1.0">

方法二：
步骤1：直接将以下内容添加到项目根目录的 index.html 的<head></head>中
<script>!function(e,t){function n(){t.body?t.body.style.fontSize=12*o+"px":t.addEventListener("DOMContentLoaded",n)}function d(){var e=i.clientWidth/10;i.style.fontSize=e+"px"}var i=t.documentElement,o=e.devicePixelRatio||1;if(n(),d(),e.addEventListener("resize",d),e.addEventListener("pageshow",function(e){e.persisted&&d()}),o>=2){var a=t.createElement("body"),s=t.createElement("div");s.style.border=".5px solid transparent",a.appendChild(s),i.appendChild(a),1===s.offsetHeight&&i.classList.add("hairlines"),i.removeChild(a)}}(window,document);</script>

步骤2：在项目根目录的 index.html 中添加如下 meta
<meta name="viewport" content="width=device-width, initial-scale=1.0">

二、px 转 rem
实际开发中，我们通过设计稿得到的值单位是 px，所以要将 px 转换成 rem 再写进样式中。我们使用 px2rem 这个工具将 px 转换成 rem，它有 webpack 的 loader：px2rem-loader
1.安装 px2rem-loader：$ npm i px2rem-loader --save-dev
2.配置 px2rem-loade
在 vue-cli 生成的 webpack 配置中，vue-loader 的 options 和其他样式文件 loader 最终是都是由 build/utils.js 里的一个方法生成的。我们只需在 cssLoader 后再加上一个 px2remLoader 即可，px2rem-loader 的 remUnit 选项意思是 1rem=多少像素，结合 lib-flexible 的方案，我们将 px2remLoader 的 options.remUnit 设置成设计稿宽度的 1/10，这里我们假设设计稿宽为 750px。修改配置后重启项目，然后我们就可以在组件中写单位直接写 px，设计稿量多少就可以写多少。
var cssLoader = {
loader: 'css-loader',
...
}
}
var px2remLoader = {
loader: 'px2rem-loader',
options: {
remUnit: 75
}
}
并放进 loaders 数组中
function generateLoaders(loader, loaderOptions) {
var loaders = [cssLoader, px2remLoader]
...
}

【css、sass、less】
一、css
内联式：<style lang="css">······</style>
外联式：<style lang="css">@import './xxx.css'</style> 或者 <style lang="css" src="./index.css"></style>
二、scoped属性说明
给style添加scoped为组件内 CSS 指定作用域，使得当前样式只作用于当前组件的节点，防止变量污染。
scoped 属性会自动添加一个唯一的属性。
例如：编译的时候 .list-container:hover 会被编译成类似 .list-container[data-v-21e5b78]:hover。
<style scoped>
@media (min-width: 250px) {
.list-container:hover {
background: orange;
}
}
</style>
注意点：如果有嵌套子组件，那么将无法在父组件中设置子组件的样式
三、sass、less
在vue-cli中已经配置好了sass、less，使用sass、less来编写css样式，步骤十分简洁，只需下载两个模块，webpack会根据 lang 属性自动用适当的加载器去处理。
1.安装 sass 或者 less 模块
npm install node-sass sass-loader --save-dev npm install less less-loader --save-dev
2.使用
sass
内联式：<style lang="sass">······</style>
外联式：<style lang="sass">@import './xxx.css'</style> 或者 <style lang="sass" src="./xxx.css"></style>
less
内联式：<style lang="less">······</style>
外联式：<style lang="less">@import './xxx.css'</style> 或者 <style lang="less" src="./xxx.css"></style>

【vue-router】
一、安装 和 CDN文件
安装：$ npm install vue-router --save
CDN文件链接：https://unpkg.com/vue-router/dist/vue-router.js
说明：
链接一直指向在 NPM 发布的最新版本；
也可以像 https://unpkg.com/vue-router@2.0.0/dist/vue-router.js 这样指定 版本号 或者 Tag。

【express搭建服务模拟数据请求与响应】
一、安装：
npm install express--save-dev npm install morgan --save-dev
npm install cors --save-dev 【axios】 一、安装和CDN文件 安装： npm install axios --save
CDN文件链接:https://unpkg.com/axios/dist/axios.min.js
【vuex】
一、安装和CDN文件
安装：$ npm install vuex --save
CDN文件链接: https://unpkg.com/vuex
二、使用