一、git管理代码的流程（master为公司的主分支）
1、克隆项目：git clone https://github.com/AAA/BBB.git
2、连接到远程仓库：git remote add origin https://github.com/AAA/BBB.git
3、建立分支：git branch branch_1
4、切换到分支：git checkout branch_1
5、====写代码。3和4可以合并为git checkout -b branch_1
6、添加到暂存区：git add README.md
7、添加到历史区：git commit -m "first branch_1"
/////////////////////////////////////////////////////////
8、切换到master分支：git checkout master（把2放到在8、9之间操作，似乎也行）
9、拉取master分支内容：git pull origin master（这个操作很重要，最新代码将覆盖旧代码）
10、把branch_1分支的内容合并到master分支：git merge branch_1（可能会发生冲突）
11、推送到远程仓库：git push -u origin master（从第2次开始，使用git push即可）
12、切换到branch_1分支：git checkout branch_1
13、把master分支的内容合并到branch_1分支：git merge master（不会发生冲突）
14、合并说明
（1）在本地master上，pull最新master版本master_1、master_1将覆盖master的原有；
（2）在本地master_1上，merge我开发的master分支branch_1,branch_1的当前提交将取代master的原有,可能与master_1发生冲突，解决这个冲突并push master_1；
（3）在本地branch_1的当前提交上，merge master_1，因master_1刚merge了branch_1的当前提交，所以master_1将覆盖branch_1的当前提交，且不发生冲突，同时不需要push branch_1
二、gitLab的提交地址由http改为https后，下拉代码不成功，解决方案如下：
过程：audit-html文件夹下空白处--右键单击---鼠标置于TortoiseGit(t)上---单击设置---单击确定--单击“编辑本地.git/config(L)”---把第9行代码中的http改成https，即可。
三、冲突提示
<<<<<<< HEAD
本地向服务器提交的内容（我写的）
=======
服务器下载到本地的内容（人家写的）
>>>>>>>b0ef58d69851fedad4169878a62033c0ce16246c
四、淘宝npm镜像使用方法
来源https://blog.csdn.net/quuqu/article/details/64121812
1.临时使用（已使用）
npm --registry https://registry.npm.taobao.org install express
2.持久使用
npm config set registry https://registry.npm.taobao.org
配置后可通过下面方式来验证是否成功
npm config get registry 或 npm info express
3.通过cnpm使用
npm install -g cnpm --registry=https://registry.npm.taobao.org
使用
cnpm install express
五、webStorm设置
1、Ctrl+滚轮：放缩字体大小
file----setting----editor----general----(勾选)change font size (zoom) with ctrl+mousewheel----(点击)OK
2、去掉右侧竖线
file----setting----editor----general----appearance----show right margin (configured in code style options)
3、设置字体大小（Consolas, 'Courier New', monospace）
file----setting----editor----color&font----font
4、创建文件名后缀
file----new----edit file templates...----(点击)+----Name(任意填)，Extension(填后缀名)----(点击)OK
5、webstorm设置ES6
file----setting----languages&frameworks----javascirpt----templates----language for comments----ECMAscript6----(点击)OK
6、设置快捷键
file----setting----editor----live templates----(点击右侧)+----(点击)1.live templates
7、取消撤销: ctrl + shift + z （使用前需要把搜狗输入法调至英文输入状态）
8、Ctrl+Alt+L:格式化代码
9、Ctrl+N:搜索类
10、Ctrl+H:查看类继承关系
11、Ctrl+Shift+N:按文件名搜索
12、Alt+F7:查找函数或变量在哪被使用
13、Shift+Shift:(A)类，文件，配置项，快捷键，函数，路径等等都能搜索。(B)搜索时，搜索字符串带/就可以搜索路径了
14、WebStorm手机端页面适配快捷键
（1）输入: meta:vp
（2）再按tab键就出来了.
（3）这行代码,会将HTML5自动适配成手机端页面
15、常用快捷键，https://www.cnblogs.com/wanglexueshilengde/p/8390730.html
16、设置自定义代码块：file--setting--editor--live template--"+"
17、WebStorm更换背景颜色的方法：file--setting--Appearance & Behavior--Appearance--点击下拉箭头--选择--OK
18、WebStrom Live Template 建代码块：File—editor—live templates—javascript，+，abbreviation:(简写代码，比如ccc)，templates text: (详写代码，比如console.log())，define(勾选，比如javascript,typescript)，apply，ok
六、VSCode设置
1、VSCode关闭右侧预览功能
file----preference----setting----搜索"editor.minimap.enabled"
2、VSCode修改字体大小
file----preference----setting----Font Zize
3、VSCode修改字体
file----preference----setting----Font Family
4、vscode设置颜色主题
file----preference----Color Theme
5、vscode同时打开多个文件
单击：新的文件覆盖旧文件
双击：新的文件不会覆盖旧文件
6、VSCode设置成中文语言环境
打开vscode =>Ctrl+Shift+p=>configure display language=>确定=>“locale”:“zh-CN”=>重启vscode工具=>商店(最左侧最下方图标)=>Chinese（Simplied） Lang=>安装。
7、VSCode菜单栏隐藏与显示
隐藏：查看=>切换菜单栏
显示：ctrl+shift+p=> view:toggle menu bar
8、VSCode活动栏隐藏与显示
隐藏：右键资源管理器=>隐藏活动栏
显示：查看——外观——显示活动栏
左右切换：右键资源管理器=>将侧边栏移到左/右侧
9、vscode 自动折行
文件=>首选项=>设置=>on(editor:word wrap)
10、VSCode改左侧窗口字体大小
在vscode安装目录下:C:\Program Files\Microsoft VS Code\resources\app\out\vs\workbench
找到workbench.main.css文件，打开并找到“.part>.content{font-size:”进行修改
11、vs code预览
安装view in browser--右键html--点击view in browser
12、vscode 快速生成html
点击新建文件--命名1.html--在空html中输入"!"--按下tab键。
13、vscode 修改选项卡字体
在vscode安装目录下:C:\Program Files\Microsoft VS Code\resources\app\out\vs\workbench
找到workbench.main.css文件，打开并找到“.title .title-label a{text-decoration:none;font-size:”进行修改
14、VSCode滚轮改变字体大小
file----preference----setting----搜索"mouseWheelZoom"(单词之间没有空格)----勾选
15、vscode设置缩进2个空格
file----preference----setting----Editor:Tab Size----2
16、vscode设置选项卡高度
在vscode安装目录下:C:\Program Files\Microsoft VS Code\resources\app\out\vs\workbench
找到workbench.main.css文件，打开并找到下列三项，进行设置。
.title .editor-actions{cursor:default;flex:initial;padding-left:4px;height:
.tab{position:relative;display:flex;white-space:nowrap;cursor:pointer;height:
.title .tabs-container{display:flex;height:
17、Visual Studio Code修改颜色主题
文件——首选项——颜色主题；
18、vscode如何用谷歌浏览器预览html文件
(1)安装“view in browser”
(2)安装“open in browser”
(3)文件---首选项---设置---输入"open-in-browser.default"---“Chrome”
(4)右键“x.html”---“Open in Default Browsers”
19、VS Code中怎么运行js文件
(1)安装插件code runner
(2)安装node环境
(3)F5
20、恢复默认设置
右键快捷图标-点击打开文件所在位置-在顶部导航框里，按照如下路径找到这个文件AppData\Roaming\Code\User\settings.json-删除settings.json即可
七、vscode快捷键
来源：https://www.cnblogs.com/weihe-xunwu/p/6687000.html
1、注释：
a) 单行注释：[ctrl+k,ctrl+c] 或 ctrl+/
b) 取消单行注释：[ctrl+k,ctrl+u] (按下ctrl不放，再按k + u)
c) 多行注释：[alt+shift+A]
d) 多行注释：ctrl+/ (双斜线)
2、移动行：alt+up/down
3、显示/隐藏左侧目录栏 ctrl + b
4、复制当前行：shift + alt +up/down
5、删除当前行：shift + ctrl + k
6、控制台终端显示与隐藏：ctrl + ~
7、查找文件/安装vs code 插件地址：ctrl + p
8、代码格式化：shift + alt +f
9、新建一个窗口 : ctrl + shift + n
10、行增加缩进: ctrl + [
11、行减少缩进: ctrl + ]
12、裁剪尾随空格(去掉一行的末尾那些没用的空格) : ctrl + shift + x
13、字体放大/缩小: ctrl + ( + 或 - )
14、拆分编辑器 : ctrl + 1/2/3
15、切换窗口 : ctrl + shift + left/right
16、关闭编辑器窗口 : ctrl + w
17、关闭所有窗口 : ctrl + k + w
18、切换全屏 : F11
19、自动换行 : alt + z
20、显示git : ctrl + shift + g
21、全局查找文件：ctrl + shift + f
22、显示相关插件的命令(如：git log)：ctrl + shift + p
23、选中文字：shift + left / right / up / down
24、折叠代码： ctrl + k + 0-9 (0是完全折叠)
25、展开代码： ctrl + k + j (完全展开代码)
26、删除行 ： ctrl + shift + k
27、快速切换主题：ctrl + k / ctrl + t
28、快速回到顶部 ： ctrl + home
29、快速回到底部 : ctrl + end
30、格式化选定代码 ：ctrl + k / ctrl +f
31、选中代码 ： shift + 鼠标左键
32、多行同时添加内容（光标） ：ctrl + alt + up/down
33、全局替换：ctrl + shift + h
34、当前文件替换：ctrl + h
35、打开最近打开的文件：ctrl + r
36、打开新的命令窗：ctrl + shift + c
37、函数代码块的注释生成方法：安装插件“Document This”；将光标放置于function上面，快捷键Ctrl+Alt+D；
38、代码正则替换：在Ctrl+H后，会出现两行搜索框，上行搜索框的右侧有雪花号，点击雪花号，正则替换可以使用了
39、编辑器设置背景
"update.enableWindowsBackgroundUpdates": true,
"background.customImages": [
"D:/meinv.png",
],
"background.style": {
"content": "''",
"pointer-events": "none",
"position": "absolute",
"width": "100%",
"height": "120%",
"z-index": "99999",
"background.repeat": "repeat-Y",
"background-size": "cover",
"opacity": 0.2
},
"background.useFront": true,
"background.useDefault": false
八、vscode加注释块的方法
1、安装插件KoroFileHeader
2、在"setting.json"中添加
// 文件头部注释
"fileheader.customMade": {
"Descripttion":"",
"version":"",
"Author":"sueRimn",
"Date":"Do not edit",
"LastEditors":"sueRimn",
"LastEditTime":"Do not Edit"
},
//函数注释
"fileheader.cursorMode": {
"name":"",
"test":"test font",
"msg":"",
"param":"",
"return":""
}
3、快捷键：
（1）文件头部：crtl+alt+i
（2）函数注释：crtl+alt+t
///////////////////////////////////////////////////////////
九、.eslintrc.js使用示例
ESLint最初是由Nicholas C. Zakas 于2013年6月创建的开源项目。它的目标是提供一个插件化的javascript代码检测工具。
module.exports = {
"env": {
"browser": true,
"node": true
},
"globals": {//不在这里配置而使用下列变量，则会报错
"angular": true,
"WebUploader": true,
"editormd": true,
"$": true,
"Swiper": true,
"echarts": true,
"phantom": true,
"NProgress": true,
"html2canvas": true,
"$scope": true,
"laydate": true,
"layer": true,
"Mock": true,
'_': true,
'alasql': true
},
"extends": "eslint:recommended",
"rules": {
"indent": [
"error",
2
],
"linebreak-style": 'off',
"quotes": [
"error",
"single"
],
"semi": [
"error",
"always"
],
}
};
十、vscode加代码块的方法
打开vscode>文件>首选项>用户代码片段>
1、html
{
"jq": {
"prefix": "jq",
"body": [
"<!DOCTYPE html>",
"<html lang='en'>",
"<head>",
" <meta charset='UTF-8'>",
" <title>jq</title>",
" <script src='https://cdn.bootcss.com/jquery/1.9.1/jquery.js'></script>",
"</head>",
"<body>",
" <div>",
" $1",
" </div>",
"</body>",
"</html>",
"<script type='text/javascript'>",
" ",
"</script>"
],
"description": "jq"
},
"echarts": {
"prefix": "echarts",
"body": [
"<!DOCTYPE html>",
"<html lang='en'>",
"<head>",
" <meta charset='UTF-8'>",
" <title></title>",
" <script src='https://cdn.bootcss.com/echarts/3.7.1/echarts.js'></script>",
"</head>",
"<body>",
" <div id='myEchartsId' style='height:300px;'></div>",
"</body>",
"</html>",
"<script type='text/javascript'>",
" var myEcharts = echarts.init(document.getElementById('myEchartsId'));",
" var myEchartsOption = { ",
" };",
" myEcharts.setOption(myEchartsOption);",
"</script>",
],
"description": "echarts"
},
"ng": {
"prefix": "ng",
"body": [
"<!DOCTYPE html>",
"<html lang='en' ng-app='myModel'>",
"<head>",
" <meta charset='UTF-8'>",
" <title>ng</title>",
" <script src='https://cdn.bootcss.com/angular.js/1.6.2/angular.js'></script>",
"</head>",
"<body>",
" <div ng-controller='firstCtrl'>",
" $1",
" </div>",
"</body>",
"</html>",
"<script type='text/javascript'>",
" var app = angular.module('myModel', []);",
" app.controller('firstCtrl', function ($scope){",
" ",
" });",
"</script>"
],
"description": "ng"
},
"bt": {
"prefix": "bt",
"body": [
"<!DOCTYPE html>",
"<html lang='en'>",
"<head>",
" <title>两列高度自适应</title>",
" <link rel='stylesheet' href='https: //cdn.staticfile.org/twitter-bootstrap/4.1.1/css/bootstrap.min.css'>",
" <style>",
" .row>div {",
" background: #cccccc;",
" }",
" </style>",
"</head>",
"<body>",
" <div class='container'>",
" <div class='row'>",
" <div class='col-xl-6'>col-xl-6;col-xl-6;col-xl-6;</div>",
" <div class='col-xl-5'>col-xl-6</div>",
" </div>",
" </div>",
"</body>",
"</html>",
],
"description": "bt"
},
}
2、js
{
"c1": {
"prefix": "c1",
"body": [
"console.log($0);"
],
"description": "console.log($0)"
},
"c2": {
"prefix": "c2",
"body": [
"console.log('$0');"
],
"description": "console.log('$0')"
},
"fn": {
"prefix": "fn",
"body": [
"function $0(){",
" ",
"}",
],
"description": "function $0()"
},
"ng": {
"prefix": "ng",
"body": [
"(function () {",
" angular",
" .module('$0')",
" .controller('', function ($scope) {",
" ",
" });",
"})();",
],
"description": "ng"
}
}
3、jQuery
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<title>jq</title>
<script src='https://cdn.bootcss.com/jquery/1.9.1/jquery.js'></script>
</head>
<body>
<div>
</div>
</body>
</html>
<script type='text/javascript'>
</script>
4、echarts
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<title></title>
<script src='https://cdn.bootcss.com/echarts/3.7.1/echarts.js'></script>
</head>
<body>
<div id='myEchartsId' style='height:300px;'></div>
</body>
</html>
<script type='text/javascript'>
var myEcharts = echarts.init(document.getElementById('myEchartsId'));
var myEchartsOption = {
};
myEcharts.setOption(myEchartsOption);
</script>
5、angular1
<!DOCTYPE html>
<html lang='en' ng-app='myModel'>
<head>
<meta charset='UTF-8'>
<title>ng</title>
<script src='https://cdn.bootcss.com/angular.js/1.6.2/angular.js'></script>
</head>
<body>
<div ng-controller='firstCtrl'>
</div>
</body>
</html>
<script type='text/javascript'>
var app = angular.module('myModel', []);
app.controller('firstCtrl', function ($scope){
});
</script>
6、bootstrap
<!DOCTYPE html>
<html lang='en'>
<head>
<title>两列高度自适应</title>
<link rel='stylesheet' href='https: //cdn.staticfile.org/twitter-bootstrap/4.1.1/css/bootstrap.min.css'>
<style>
.row>div {
background: #cccccc;
}
</style>
</head>
<body>
<div class='container'>
<div class='row'>
<div class='col-xl-6'>col-xl-6;col-xl-6;col-xl-6;</div>
<div class='col-xl-5'>col-xl-6</div>
</div>
</div>
</body>
</html>
十一、webpack
1、join与resolve都是用来拼接路径的，join方法生成的相对路径，resolve方法生成的是绝对路径
