vscode & iterm2 & Chrome 配置等

时间 2019-11-16

标签 vscode iterm2 iterm chrome 配置栏目 Mac OS 繁體版

原文原文链接

本文内容： vscode的插件推荐及 settings.json配置、谷歌插件、网站推荐、iterm2配置、mac好用的软件javascript

1. `gif`录制软件 `kap`

🖥官网

2. 终端`iterm2`

🖥官网
Powerlevel9k主题的 github地址
以下是 Powerlevel9k 主题效果图⬇️：

展开查看配置详情

1️⃣ 安装 Oh-My-Zsh 🖥官网css

sh -c "$(curl -fsSL https://raw.github.com/robbyrussell/oh-my-zsh/master/tools/install.sh)" 
复制代码

安装好以后，须要把 Zsh 设置为当前用户的默认 Shell（这样新建标签的时候才会使用 Zsh）：html

chsh -s /bin/zsh
复制代码

2️⃣git 安装自动建议填充 autosuggestionshtml5

cd ~/.oh-my-zsh && git clone https://github.com/zsh-users/zsh-autosuggestions $ZSH_CUSTOM/plugins/zsh-autosuggestions
复制代码

3️⃣ git 安装声明高亮 syntax-highlightingjava

cd ~/.oh-my-zsh && git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting
复制代码

4️⃣ git 安装主题🎨 Powerlevel9knode

git clone https://github.com/bhilburn/powerlevel9k.git ~/.oh-my-zsh/custom/themes/powerlevel9k
复制代码

5️⃣ 安装字体🎨 Nerdsreact

Nerds githubgit

cd ~/Library/Fonts && curl -fLo "Droid Sans Mono for Powerline Nerd Font Complete.otf" https://github.com/ryanoasis/nerd-fonts/raw/master/patched-fonts/DroidSansMono/complete/Droid%20Sans%20Mono%20Nerd%20Font%20Complete.otf
复制代码

6️⃣ 修改配置⚙文件️github

vim ~/.zshrc
复制代码

找到 plugins，此时 plugins 中应该已经有了 git ，咱们加上 autosuggestions 和 syntax-highlightingweb

而后在文件的最后一行添加：

source ~/.oh-my-zsh/custom/plugins/zsh-syntax-highlighting/zsh-syntax-highlighting.zsh
复制代码

终端命令行下用 vscode 打开文件或目录（可省略）:

alias code='/Applications/Visual\ Studio\ Code.app/Contents/Resources/app/bin/code'
复制代码

主题，找到 ZSH_THEME 替换这一行为下面的内容 ⬇️：

POWERLEVEL9K_MODE="nerdfont-complete"
ZSH_THEME="powerlevel9k/powerlevel9k"

# 提示符修改
# command line 左侧要显示的信息
POWERLEVEL9K_LEFT_PROMPT_ELEMENTS=(dir dir_writable rbenv vcs)
# command line 右侧要显示的信息
POWERLEVEL9K_RIGHT_PROMPT_ELEMENTS=(status root_indicator background_jobs ram load history time)
# 提示符分两行显示
POWERLEVEL9K_PROMPT_ON_NEWLINE=true
# 在提示符与要输入的指令之间增长空格
POWERLEVEL9K_MULTILINE_FIRST_PROMPT_PREFIX="%f"
# 当前用户为 root 时，提示符为"#"，不然为"$"
local user_symbol="$"
if [[ $(print -P "%#") =~ "#" ]]; then
    user_symbol = "#"
fi
POWERLEVEL9K_MULTILINE_LAST_PROMPT_PREFIX="%{%B%F{black}%K{yellow}%} $user_symbol%{%b%f%k%F{yellow}%} %{%f%}"
# 没执行完一条指令在最后增长一空行
POWERLEVEL9K_PROMPT_ADD_NEWLINE=true
复制代码

7️⃣ 按下 esc, 再按下 :wq ，输入 source ~/.zshrc 使更改生效

以下更改字体🎨设置⬇️：

3. `homebrew` 🖥官网

安装 homebrew

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
复制代码

用 homebrew 安装 node 、git

brew install node
brew install git
复制代码

使用 npm 打开第三方库的主页或 github, 下面是 antd 的例子🌰：

npm home antd
npm repo antd
复制代码

4. `Keycastr` github

效果⬇️：
使用homebrew 安装

brew cask install keycastr
复制代码

5. `CheatSheet`

🖥官网
长按 command 显示当前程序快捷键，以下是 vscode 的显示⬇️:

因为页面️常常404 , 我上传到个人百度云盘了⬇️

️CheatSheet 百度云盘，🔑密码: in09

6. `Google Chrome` 插件

7. `vscode` 🖥官网

配置 `settings.json`⚙

{
    "[javascriptreact]": {},
    "files.associations": {
        "*.js": "javascriptreact"
    },
    "emmet.includeLanguages": {
        "javascript": "javascriptreact",
    },
    "editor.tokenColorCustomizations": {
        "textMateRules": [
            {
                "scope": [
                    "entity.name.function",
                    "support.function"
                ],
                "settings": {
                    "fontStyle": "bold"
                }
            }
        ]
    },
    "editor.minimap.renderCharacters": false, // minimap 展现为色块
    "editor.minimap.maxColumn": 200,
    "editor.minimap.showSlider": "always",
    // "editor.cursorSmoothCaretAnimation": true,
    "files.trimTrailingWhitespace": true, // 保存文件时剪裁尾随空格
    "files.insertFinalNewline": true, // 保存文件时在文件末尾插入一个最终新行
    "editor.lineHeight": 25, // 控制行高
    "javascript.implicitProjectConfig.experimentalDecorators": true,
    "window.zoomLevel": 0,
    "workbench.colorTheme": "One Dark Pro Bold", // 颜色主题
    "breadcrumbs.enabled": true, // 面包屑
    // "editor.codeActionsOnSave": {
    //   "source.organizeImports": true // 文件保存时整理 import 语句
    // }
    // "terminal.integrated.fontFamily": "Meslo LG M for Powerline",
    "terminal.integrated.fontFamily": "DroidSansMono Nerd Font", // 控制终端的字体 和 iterm2 的效果一致
    "terminal.integrated.shell.osx": "zsh", // 终端在 macOS 上使用的 Shell 的路径
    "diffEditor.ignoreTrimWhitespace": true,
    "editor.renderIndentGuides": false,
    "workbench.iconTheme": "material-icon-theme",
    "material-icon-theme.folders.theme": "specific",
    "material-icon-theme.activeIconPack": "react_redux",
    "editor.suggestSelection": "first",
    "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
    "eslint.autoFixOnSave": true,

}
复制代码