工欲善其事必先利其器

1. vscode常用插件：
   prettier 代码格式化插件。
   HTML Snippets 提示html标签
   HTML CSS Support 提示css属性 //antdesignpro用这个插件会卡死CPU占用率高
   Beautify css/sass/scss/less 代码格式化
   Npm Intellisense 依赖包提示
   ESlint代码检查
   Vscode Greate Icon 图标展示
   JavaScript (ES6) code snippets 语法提示
   Path Intellisense自动路径补全
   Auto Rename Tag 修改html标签时首尾同时改

• 常用设置：首选项-》用户设置
  “editor.formatOnSave”: true，保存自动格式化
  “files.autoSave”: “afterDelay”,自动保存
  “emmet.triggerExpansionOnTab”: true，设置tab标签补全
  最新设置见文末
  其他个人设置可在jsconfig.json里配置。
• 常用快捷键：
  cmd+p 打开文件
  cmd+b 打开侧边栏
  cmd+\分区，多文件编辑
  cmd+shift+\找到{ }函数结束/开始位置
  cmd+i 选中一行
  cmd+opt+F 打开文件中替换
  cmd+F 文件查找
  cmd+shift+F 文件夹查找
  cmd+opt+up/down 多行编辑
  opt+shift+up/down 复制一行
  opt+up/down 移动到上一行
  ctrl+tab标签之前切换
  ctrl+` 打开控制台
  cmd+shift+u git输出
• node断点调试

2. mock数据：
   mock 是基于 浏览器代理加node代理实现的。 本地start后自动启动一个端口为8989的proxy server。浏览器通过代理（我使用的是switchy omega）代理到8989的服务器，然后8989服务器读取本地proxy.config.js的配置完成转发。假设mock serverIP为3.23.1.1。

• 浏览器switchomega
  添加情景模式
  mock 端口为8989
  添加域名通配符
  条件设置为*XX.com 情景模式为mock

• 设置proxy.config.js进行转发
  module.exports = {
  // Forward 到另一个服务器
  “/hrmregister/(.)": “http://3.23.1.1:2016”,
  “GET rlw”: “http://3.23.1.1:8000”,
  };
  可通过配置host将IP指向某域名：
  host添加，命令行进入etc/hosts修改或者安装switch hosts进行修改 3.23.1.1 mock.XX.com
  module.exports = {
  // hrmregister开头的动态请求转发到mock server
  "/hrmregister/(.)”: “http://mock.XX.com:2016”（存放动态文件）,
  “GET rlw”: “http://mock.XX.com:8000”（存放静态文件）,
  };

• PS：可配置mock server 将测试接口的服务器地址改为mock server地址，即入3.23.1.1：2016。填入接口mock数据即可使用mock数据进行测试~~~
  PS:提供代理服务的电脑系统或其它类型的网络终端称为代理服务器（英文：Proxy Server）
  另：关于开发 线上环境请求url处理：https://my.oschina.net/wanjubang/blog/916105。代理模式线上环境不走proxy.config.js？

3. 移动端调试工具 连接手机 输入chrome://inspect/，点击inspect进行调试即可
4. charles
5. 部署发布工具 shell 发布不直观，建议使用web管理工具比如pyledo
6. 其它：nvm可切换node版本；JIRA是集项目计划、任务分配、需求管理、错误跟踪于一体的商业软件；

---

vscode设置：
{
“workbench.iconTheme”: “vscode-great-icons”,
“window.zoomLevel”: -1,
“extensions.ignoreRecommendations”: true,
“workbench.startupEditor”: “newUntitledFile”,
“emmet.triggerExpansionOnTab”: true,
“explorer.confirmDragAndDrop”: false,
“explorer.confirmDelete”: false,
“files.autoSave”: “afterDelay”,
“editor.formatOnSave”: true,
“editor.formatOnPaste”: true,
“vetur.format.defaultFormatter.js”: “vscode-typescript”,
“vetur.format.defaultFormatter.html”: “js-beautify-html”,
“vetur.format.defaultFormatterOptions”: {
“js-beautify-html”: {
“wrap_attributes”: “auto”
}
}
}
安装插件：
Auto Rename Tag //自动补全
Beautify css/sass/scss/less //格式化
GitLens — Git supercharged //git代码最近的commit和作者
HTML CSS Support //css提示（支持vue）
JavaScript (ES6) code snippets//ES6语法代码段
npm Intellisense //导入模块时，提示已安装模块名称
Path Intellisense //路径自动补全
Vetur //Vue语法高亮
Prettier - Code formatter //格式化
Settings Sync //同步配置插件信息
VSCode Great Icons//图标
REST client //本地请求发送
在VS Code新建一个以.http或者.rest 结尾的文件，填入你的HTTP请求，点击Send Request，或者右键选择Send Request，或者直接用快捷键 Ctrl+Alt+R ，你的REST API就执行了，然后API Response就会显示在右边区域。更方便的是，通过###分隔符，同一个HTTP文件里可以涵盖多个HTTP请求。不像Postman，不同的HTTP请求需要放在不同的tab里。

POST http://10.45.11.67:8700/rest/bizService/listPagination
content-type: application/json
Authorization: 626f2e3a-2bb2-4179-83a0-0524b759a446

{"pageNumber":1,"pageSize":20}

####
GET http://10.45.11.67:8700/security/rest/operator/getCurrentOperator?_hash=0.21774316768178514&
Authorization: 44d22273-facf-4684-b879-240dd3c1474d

{
    "_hash":0.21774316768178514
}