工具设置

发表于 分类于 阅读次数：

NodeJS

.npmrc 配置

registry=https://registry.npm.taobao.org/
sass_binary_site=https://npm.taobao.org/mirrors/node-sass
chromedriver_cdnurl=https://npm.taobao.org/mirrors/chromedriver
phantomjs_cdnurl=https://npm.taobao.org/mirrors/phantomjs
electron_mirror=https://npm.taobao.org/mirrors/electron

该文件的一般路径为：~/.npmrc

Git

大多数时候，我们的机器上会有很多的 Git Host，比如公司 Gitlab、 Github、 OSChina 等，那我们就需要在本地配置多个 SSH Key，使得不同的 Host 能使用不同的 SSH Key 。配置方法如下（以公司 Gitlab 和个人 Github 为例）：

为公司 Gitlab 生成一对秘钥 SSH Key

ssh-keygen -t rsa -C 'youremail@xxx.com' -f ~/.ssh/gitlab_id-rsa

为个人 Github 生成一对秘钥 SSH Key

ssh-keygen -t rsa -C 'yourotheremail@xxx.com' -f ~/.ssh/github_id-rsa

这时去查看 ~/.ssh 目录下的文件，会有 gitlab_id-rsa、 gitlab_id-rsa.pub 和 github_id-rsa、 github_id-rsa.pub 四个文件

在 ~/.ssh 目录下新建名称为 config 的文件（无后缀名）。用于配置多个不同的 host 使用不同的 SSH Key，内容如下：

# 配置文件参数
# Host : Host 可以看作是一个你要识别的模式，对识别的模式，进行配置对应的的主机名和 ssh 文件（根据实际情况进行修改）
# HostName : 要登录主机的主机名（根据实际情况进行修改）
# User : 登录名，一般是 ssh 路径中主机名的前缀
# IdentityFile : 指明上面 User 对应的 identityFile 路径

# gitlab
Host gitlab.com
HostName gitlab.com
PreferredAuthentications publickey
User git
IdentityFile ~/.ssh/gitlab_id-rsa

# github
Host github.com
HostName github.com
PreferredAuthentications publickey
User git
IdentityFile ~/.ssh/github_id-rsa

按照上面的步骤分别往 Gitlab 和 Github 上添加生成的公钥 gitlab_id-rsa.pub 和 github_id-rsa.pub

OK，大功告成，再次执行 git 命令验证就已经不需要再次验证权限了。

Homebrew

详细教程，请参考：Homebrew 国内镜像使用教程

Alfred

外观设置（字体、颜色）

{
  "alfredtheme": {
    "result": {
      "textSpacing": 7,
      "subtext": {
        "size": 20,
        "colorSelected": "#FFFFFFA7",
        "font": "FZJingLeiS-R-GB",
        "color": "#FFFFFF4F"
      },
      "shortcut": {
        "size": 24,
        "colorSelected": "#FFFFFF9E",
        "font": "FZJingLeiS-R-GB",
        "color": "#FFD478FF"
      },
      "backgroundSelected": "#00000051",
      "text": {
        "size": 30,
        "colorSelected": "#37ADFFFF",
        "font": "FZJingLeiS-R-GB",
        "color": "#FFFFFF8A"
      },
      "iconPaddingHorizontal": 6,
      "roundness": 0,
      "paddingVertical": 3,
      "iconSize": 44
    },
    "search": {
      "background": "#00000000",
      "paddingVertical": 5,
      "spacing": 5,
      "text": {
        "size": 36,
        "colorSelected": "#000000FF",
        "font": "FZJingLeiS-R-GB",
        "color": "#FFFFFFFF"
      },
      "roundness": 0,
      "backgroundSelected": "#B2D7FFFF"
    },
    "window": {
      "color": "#00000085",
      "paddingHorizontal": 0,
      "width": 573,
      "borderPadding": 0,
      "borderColor": "#000000FF",
      "blur": 25,
      "roundness": 3,
      "paddingVertical": 5
    },
    "credit": ".·°oO",
    "separator": {
      "color": "#CD00FFFF",
      "thickness": 0
    },
    "scrollbar": {
      "color": "#00000033",
      "thickness": 3
    },
    "name": "MuYesAlfredTheme"
  }
}

复制以上代码，生成 customized.alfredappearance 文件，双击即可。字体使用的是方正静蕾体

详细教程，请参考：高效 Alfred 进阶

Visual Studio Code

快捷键

  • 删除行内容： command + shift + k
  • 删除左侧内容： command + backspace
  • 删除右侧内容： command + delete
  • 移动到行首行尾：command + ← 、 command + →
  • 上下移动： option + ↑ 、 option + ↓
  • 移动到文档的开头和末尾： command + ↑ 、 command + ↓
  • 回到上一个光标的位置： command + u
  • 花括号跳转： command + shift + \
  • 块注释： Option + Shift + a
  • 快速打开文件： command + p

插件推荐及使用

REST Client

简介

在测试 REST API 的时候，想必大家都会有不同的工具选择。如果是基于 CLI 的话，大家应该会选择 cURL。如果是 GUI 工具的话，相信很多人都会使用 Postman。不过今天，如果开发是使用 vs code，那么我推荐 REST Client 插件

我们在 vs code 新建一个以 .http 或者 .rest 结尾的文件，填入你的 HTTP 请求，点击 Send Request，或者右键选择 Send Request，或者直接用快捷键 Ctrl+Alt+R ，你的 REST API 就执行了，然后 API Response 就会显示在右边区域。是不是很方便？

特点

  1. 通过 ### 分隔符，同一个 HTTP 文件里可以涵盖多个 HTTP 请求。
  2. Authentication: REST Client 支持了 Basic Auth，SSL Client Certificates，Azure Active Directory 等多种验证机制
  3. Cookies 的支持
  4. 支持 HTTP 3xx 的重定向
  5. 变量的支持：环境变量，文件变量，预定义的系统变量等等

配置文件示例

@hostname = api.example.com
@port = 8080
@host = {{hostname}}:{{port}}
@contentType = application/json

###
@name = hello

# @name login
POST https://{{host}}/api/user/login HTTP/1.1

content-type: {{contentType}}

{
  "username":{{name}},
  "password":"123"
}

###
@authToken = {{login.response.body.result.data.token}}

# @name userInfo
GET https://{{host}}/api/user/info HTTP/1.1

Content-Type: {{contentType}}
X-Authorization:{{authToken}}

其他问题

VS Code 中路径别名 @ 提示和函数跳转等问题

  • 如果我们用了路径别名 @ 等，那么我们的插件 path-intellisense 将默认不支持自动提示，但是我们对这个插件的 mappings 设置如下，就可以了。
{
  // setting.json
  "path-intellisense.mappings": {
    "@": "${workspaceRoot}/src"
  }
}
  • 我们希望 Ctrl + 鼠标左键点击一个外部方法时，能够快速跳转到对应的外部文件，很多人说 Webstorm 都可以，其实 VS Code 也可以，同样的原因，之所以不能跳转，也是因为路径别名 @ 不能被 VS Code 识别，所以我们同样需要在 VS Code 里面做映射。在项目 package.json 所在同级目录下创建文件jsconfig.json ,写上如下配置即可。
{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "allowSyntheticDefaultImports": true,
    "baseUrl": "./",
    "paths": {
      "@/*": ["src/*"]
    }
  },
  "exclude": ["node_modules"]
}

iTerm2

如何一键安装

国内：

sh -c "$(curl -fsSL https://code.aliyun.com/kar/ohmyiterm2/raw/master/install.sh)" "" aliyun

国外：

sh -c "$(curl -fsSL https://raw.githubusercontent.com/KingFalse/ohmyiterm2/master/install.sh)" "" github

它安装了什么

如何去除蓝色三角形？

操作示例

ohmyzsh 主题 starship 配置文件(~/.config/starship.toml)

# Don't print a new line at the start of the prompt
add_newline = false
[aws]
disabled = true
[battery]
disabled = true
# Replace the "❯" symbol in the prompt with "➜"
[character]
success_symbol = "[➜](bold green)"
error_symbol = "[✗](bold red)"
symbol = "[➜](bold green)"
[line_break]
disabled = false

Windows Terminal

第一步：安装相关的模块和 PowerLine 主题

如果你使用管理员权限打开 PowerShell 并且想把 oh-my-posh 安装到所有用户，输入

Install-Module posh-git
Install-Module oh-my-posh

否则输入

Install-Module posh-git -Scope CurrentUser
Install-Module oh-my-posh -Scope CurrentUser

安装完成后，输入

Import-Module posh-git
Import-Module oh-my-posh
Set-Theme PowerLine

如果出现以下报错

 无法加载文件 C:\Users\Hong\Documents\WindowsPowerShell\Microsoft.PowerShell
_profile.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 http://go.micros
oft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。
所在位置 行:1 字符: 3

以管理员身份再次运行 Windows Terminal 并输入以下命令。（没有报错请忽略）

Set-ExecutionPolicy RemoteSigned

但是这次使用 Import-Module 的指令，再次启动 PowerShell 就会发现没有效果，这是因为这些指令仅限于本次会话的 PowerShell 有效，因此，若要使这一效果在每次启动的时候都有效，那就要将其添加到启动脚本中。打开~\Documents\WindowsPowerShell新建文本文档，命名为Microsoft.PowerShell_profile.ps1（记得开拓展名显示），输入以下内容，保存。

Import-Module posh-git
Import-Module oh-my-posh
Set-Theme PowerLine

这样，在每次 PoweShell 打开的时候都会加载自定义的文件并启用 PowerLine 主题。

第二步：注册安装字体

这里使用的是更纱等距黑体，即 Sarasa Term SC 这个名称配置 windows Terminal 字体时要用到（记得有这回事）要不然小图标还是乱码。这款字体是开源字体，可以美观地显示中文，而且是等宽字体，也就说在终端中不会出现排版错误，这款字体你可以在这里下载。

第三步：改造终端的配置文件

Windows Terminal 的配置文件储存在 ~\AppData\Local\Packages\Microsoft.WindowsTerminal_8wekyb3d8bbwe\LocalState\settings.json 这个 json 文件中，在代码编辑器中打开并编辑（比如 VS Code）。

// This file was initially generated by Windows Terminal 1.0.1401.0
// It should still be usable in newer versions, but newer versions might have additional
// settings, help text, or changes that you will not see unless you clear this file
// and let us generate a new one for you.

// To view the default settings, hold "alt" while clicking on the "Settings" button.
// For documentation on these settings, see: https://aka.ms/terminal-documentation
{
  "$schema": "https://aka.ms/terminal-profiles-schema",

  "defaultProfile": "{61c54bbd-c2c6-5271-96e7-009a87ff44bf}",

  // You can add more global application settings here.
  // To learn more about global settings, visit https://aka.ms/terminal-global-settings

  // If enabled, selections are automatically copied to your clipboard.
  "copyOnSelect": false,

  // If enabled, formatted data is also copied to your clipboard
  "copyFormatting": false,

  // A profile specifies a command to execute paired with information about how it should look and feel.
  // Each one of them will appear in the 'New Tab' dropdown,
  //   and can be invoked from the commandline with `wt.exe -p xxx`
  // To learn more about profiles, visit https://aka.ms/terminal-profile-settings
  "profiles": {
    "defaults": {
      // Put settings here that you want to apply to all profiles.
    },
    "list": [
      {
        // Make changes here to the powershell.exe profile.
        "guid": "{61c54bbd-c2c6-5271-96e7-009a87ff44bf}",
        "name": "Windows PowerShell",
        "commandline": "powershell.exe",
        "hidden": false,
        //以下是新增加的配置项
        "closeOnExit": true,
        "colorScheme": "Dracula", //颜色主题名称,就是schemes下面的每个实例的 name 值
        "cursorColor": "#ffffff", //光标颜色
        "cursorShape": "filledBox", //光标类型  可选 bar empytBox filledBox vintage
        "fontFace": "Sarasa Term SC", //字体名称  安装字体时的字体名称
        "fontSize": 12, //字体大小
        "historySize": 8001,
        // "icon" : "D:\\image\\phone.jpg",     //程序的小图标，也就是在标题栏和新建中显示的图标地址
        // "backgroundImage": "D:\\image\\bga.jpg",  //配置背景图片地址
        "acrylicOpacity": 0.75, //不透明度，值越大，背景就越浓，否则就越淡
        // "backgroundImageOpacity": 0.25,      //背景图片的透明度
        "padding": "0, 0, 0, 0",
        "snapOnInput": true,
        "startingDirectory": "%USERPROFILE%",
        "useAcrylic": true, //是否开启毛玻璃特效，值为false的时候就没有毛玻璃特效
        "tabTitle": "chessYu" //标签名称
      },
      {
        // Make changes here to the cmd.exe profile.
        "guid": "{0caa0dad-35be-5f56-a8ff-afceeeaa6101}",
        "name": "命令提示符",
        "commandline": "cmd.exe",
        "hidden": false
      },
      {
        "guid": "{b453ae62-4e3d-5e58-b989-0a998ec441b8}",
        "hidden": false,
        "name": "Azure Cloud Shell",
        "source": "Windows.Terminal.Azure"
      }
    ]
  },

  // Add custom color schemes to this array.
  // To learn more about color schemes, visit https://aka.ms/terminal-color-schemes
  "schemes": [
    {
      "name": "Dracula",
      "black": "#000000",
      "red": "#ff5555",
      "green": "#50fa7b",
      "yellow": "#f1fa8c",
      "blue": "#bd93f9",
      "purple": "#ff79c6",
      "cyan": "#8be9fd",
      "white": "#bbbbbb",
      "brightBlack": "#555555",
      "brightRed": "#ff5555",
      "brightGreen": "#50fa7b",
      "brightYellow": "#f1fa8c",
      "brightBlue": "#bd93f9",
      "brightPurple": "#ff79c6",
      "brightCyan": "#8be9fd",
      "brightWhite": "#ffffff",
      "background": "#1e1f29",
      "foreground": "#f8f8f2"
    },
    {
      "name": "Ubuntu",
      "black": "#2e3436",
      "red": "#cc0000",
      "green": "#4e9a06",
      "yellow": "#c4a000",
      "blue": "#3465a4",
      "purple": "#75507b",
      "cyan": "#06989a",
      "white": "#d3d7cf",
      "brightBlack": "#555753",
      "brightRed": "#ef2929",
      "brightGreen": "#8ae234",
      "brightYellow": "#fce94f",
      "brightBlue": "#729fcf",
      "brightPurple": "#ad7fa8",
      "brightCyan": "#34e2e2",
      "brightWhite": "#eeeeec",
      "background": "#300a24",
      "foreground": "#eeeeec"
    },
    {
      "name": "AdventureTime",
      "black": "#050404",
      "red": "#bd0013",
      "green": "#4ab118",
      "yellow": "#e7741e",
      "blue": "#0f4ac6",
      "purple": "#665993",
      "cyan": "#70a598",
      "white": "#f8dcc0",
      "brightBlack": "#4e7cbf",
      "brightRed": "#fc5f5a",
      "brightGreen": "#9eff6e",
      "brightYellow": "#efc11a",
      "brightBlue": "#1997c6",
      "brightPurple": "#9b5953",
      "brightCyan": "#c8faf4",
      "brightWhite": "#f6f5fb",
      "background": "#1f1d45",
      "foreground": "#f8dcc0"
    }
  ],

  // Add custom keybindings to this array.
  // To unbind a key combination from your defaults.json, set the command to "unbound".
  // To learn more about keybindings, visit https://aka.ms/terminal-keybindings
  "keybindings": [
    // Copy and paste are bound to Ctrl+Shift+C and Ctrl+Shift+V in your defaults.json.
    // These two lines additionally bind them to Ctrl+C and Ctrl+V.
    // To learn more about selection, visit https://aka.ms/terminal-selection
    { "command": { "action": "copy", "singleLine": false }, "keys": "ctrl+c" },
    { "command": "paste", "keys": "ctrl+v" },

    // Press Ctrl+Shift+F to open the search box
    { "command": "find", "keys": "ctrl+shift+f" },

    // Press Alt+Shift+D to open a new pane.
    // - "split": "auto" makes this pane open in the direction that provides the most surface area.
    // - "splitMode": "duplicate" makes the new pane use the focused pane's profile.
    // To learn more about panes, visit https://aka.ms/terminal-panes
    {
      "command": {
        "action": "splitPane",
        "split": "auto",
        "splitMode": "duplicate"
      },
      "keys": "alt+shift+d"
    }
  ]
}

第四步：选颜色主题

配置文件内置了几个颜色主题，并且都是亮色的，很不符合一些人的胃口，这时候我们就需要在 mbadolato/iTerm2-Color-Schemes 这个仓库中寻找自己喜欢的颜色主题，这里颜色主题有足足两百多个，选完自己喜欢的，就可以到仓库的 windowsterminal 文件夹里面下载适用于 Windows Terminal 的格式。选好之后，粘贴到 schemes 这个数组里，然后在想应用的配置文件里的 colorScheme 设置为你新粘贴的主题的名字。保存后 Windows Terminal 是实时更新的，看看最终的配置效果。