Windows 打造和 macOS 几乎一样的开发体验

Legend80s
3,689 阅读5分钟

th.webp

持续更新中……

欢迎关注微信公众号：JavaScript与编程艺术

效果 ✨

image.png

oh my zsh + sharship 主题 —— Windows 系统

Windows 达到几乎和 MacOS 一样的效果花费了很大力气，故值得记录下来。

1. 替换 PS、cmd 为 git bash 📟 - 这是第一步 # 体验 +50%

PS cmd 使用体验差，字体太挫，更换字体难如登天。

安装 git 即可，因为 git 自带 git-bash。然后 VSCode 设置默认 terminal 为 git bash，从此可以通过 vscode 设置 git bash 字体。

本文所有操作都在 git bash terminal 运行。体验最贴近 Linux / macOS 且安装最便捷的终端！

Git for Windows provides a BASH emulation used to run Git from the command line. *NIX users should feel right at home, as the BASH emulation behaves just like the "git" command in LINUX and UNIX environments.

2. 定制命令行快捷键：alias 🎭 # 体验 +30%

生产力巨大提升 ~/.bash_profile 或者 ~/.zshrc：

# 不支持 `-` 切换到上次目录的可以加，`p` => `previous`
# alias p='cd -'

# --- git alias begin ---
# 获取上一次的 commit id
alias last-commit-id="git log --oneline -n 1 | awk '{ printf \$1 }'"
alias last-commit="last-commit-id | clip"

# @example ❯ last-commit-url | clip
# https://git.xx.com/xx/cloud-app-group/crp/community/community-front/-/commit/4545
last-commit-url() {
  local url=$(repo-url);
  local id=$(last-commit-id);

  echo -n "${url}/-/commit/${id}"
}


# 如果安装了 zshrc 这是默认就有
alias gst="git status"
alias st="git status"
alias gp="git push"
alias gl="git pull"
alias gcam="gaa && git commit -am"
alias gcmsg="git commit -m"
alias gco="git checkout"
alias gcm="git checkout main && git pull"
alias gmm="gcm && gco - && git merge origin main"

gcol() {
  git checkout "$1" && git pull
}

alias gaa="git add -A"
alias gcm="git checkout master"
alias gd="git diff"

# gc begin
unalias gc
# git clone and cd into the cloned folder
gc() {
  git clone "$1" && cd $(extract_repo_name "$1") && code .
}

gclone() {
  gc
}

# Open current repository url in browser. 支持一下几种格式：
# - https://git.foo.com/foo2/bar/baz.git
# - git@github.com:legend80s/stoc.git
alias repo-url="git remote get-url origin | awk '{ gsub(/:/, \"/\"); printf \$1 }' | awk '{ gsub(/^git@/, \"https://\"); printf \$1 }' | awk '{ gsub(/^https\/\/\//, \"https://\"); printf \$1 }'"

# and open it in browser using `start` in Windows
alias open-repo="repo-url | xargs start"
alias openrepo=open-repo

alias open="start"
alias open-npm="start 'https://www.npmjs.com/package/'$(grep name package.json | awk -F '"' '{ print $4 }')"


# extract git repository name from string "https://github.com/zsh-users/zsh-syntax-highlighting.git"
# input https://github.com/zsh-users/zsh-syntax-highlighting.git
# output zsh-syntax-highlighting
extract_repo_name() {
    local url="$1"
    # 使用sed和正则表达式去除.git后缀，并提取最后一部分
    echo "$url" | sed 's|.*/\(.*\)\.git|\1|'
}
# gc end
# --- git alias END ---

# ---- reg 切换 BEGIN ---
alias regget='npm config get registry'
alias regnpm='npm config set registry https://registry.npmjs.org && regget'
alias npmreg='regnpm'
alias reg公司名='npm config set registry http://nexus.公司内部.com/repository/npm-group/ && regget'
alias 公司名reg='reg公司名'
alias regtaobao='npm config set registry https://registry.npmmirror.com && regget'
alias taobaoreg='regtaobao'
alias resetreg='regnpm'
alias getreg='npm config get registry'
alias npmreg='regnpm'
# ---- reg 切换 END ---


alias dev="bun run dev"
alias b="bun run build"
alias t="bun run test"
alias c="code ."

# change_node_version_per_project begin
trim() {
    # trim leading and trailing whitespace(\s\r\t\n\v)
    # https://stackoverflow.com/questions/369758/how-to-trim-whitespace-from-a-bash-variable
    echo $1 | xargs
}

# shortcut for nvm use $(cat .nvmrc)
# if not change automaticly, use `nvmuse` change it manually
# nvmuse() {
#   change_node_version_per_project
# }

change_node_version_per_project() {
    local nvmrc_path="./.nvmrc"

    if [[ -f "$nvmrc_path" ]]; then
        local node_version=$(grep -oP '\d+(\.\d+)?(\.\d+)?' .nvmrc | head -n1)
        
        echo '---------------------------------------'
        echo "node_version in .nvmrc is $node_version"
        echo '---------------------------------------'

        cur_ver=$(node -v)
        if [[ $cur_ver =~ ^v$node_version\. ]]; then
          echo 'Current node version "'$cur_ver'" matches "'$node_version'", no need to change.'
        else
          nvm use "$node_version" || use_from_pkg_json
        fi
    else
        # echo "No .nvmrc file found in the current directory."
        use_from_pkg_json
    fi
}

use_from_pkg_json() {
    if [[ -f "./package.json" ]]; then
      local node_version=$(grep -A 2 engines package.json | grep -oP '[0-9]+' | head -n1);

      echo '---------------------------------------------'
      echo "engines.node in package.json is $node_version";
      echo '---------------------------------------------'

      # local pkg_json_path="package.json"
      # local node_version=$(jq -r '.engines.node' "$pkg_json_path" | cut -d' ' -f1)

      if [ -z "$node_version" ]; then
          echo "No node version specified in package.json."
      else
          nvm use "$node_version"
      fi
  fi
}

# call it when you change directory
cd() {
    builtin cd "$@" && change_node_version_per_project
}

alias nvmuse='change_node_version_per_project'

change_node_version_per_project
# change_node_version_per_project end



alias md='mkdir -p'
alias temp='cd /f/temp'

记得重启 bash。或者 source ~/.bash_profile .

可以通过 which 命令检查是否生效。

❯ which gco 
gco: aliased to git checkout

3. 安装 nvm 🟢💼

bing 搜索安装即可没难点不介绍。

4. 安装 bun 🍞 # 体验 +10%

若官方方式安装失败，可以尝试：

npm i -g bun

若报错:

npm ERR! Failed to find package "@oven/bun-windows-x64-baseline". You may have used the "--no-optional" flag when running "npm install".

是因为你修改了 npm registry。以下命令可以查看当前设置的 registry：

npm config get registry

修改后重试安装 bun 即可。

npm config set registry https://registry.npmjs.org

可以将其加入 alias

5. 安装 starship 🚀 # 体验 +10%

用 choco 或 scoop 安装过程太长，而且安装失败概率太大，choco 安装的 startship 只能 cmd 和 PS 用。

curl -sS https://starship.rs/install.sh | sh

curl 为 git bash 自带。这是一个技巧互联网或官方都没有提及，但出乎意料安装速度快成功率高。

5.1 配置 starship

starship.rs/config/

mkdir -p ~/.config && touch ~/.config/starship.toml

如果 starship terminal 出现乱码（而你又不想安装 nerd font 系列，Windows 安装字体也是一绝 🤣），可以修改成 Windows 支持的 emoji：

# ~/.config/starship.toml
[git_branch]
symbol = '🌱 '

[nodejs]
format = 'via [Node.js $version](bold green) '

Tips：win + . 可以唤起 emoji 键盘。Windows emoji keyboard shortcut

效果

$ swaggered on 🌱 master is 📦 v2.1.1 via Node.js v22.18.0 took 2s

  • swaggered 项目名称
  • v2.1.1 package.json 版本号
  • v22.18.0 Node.js 版本号
  • 2s 操作耗时

6. 增强终端：oh my zsh 💪 # 体验 +20%

如果你还是想念 oh-my-zsh 的插件。比如命令高亮和自动提示。独家秘方，互联网上都没有摸索了很久才搭配出来：

export ZSH="$HOME/.oh-my-zsh"
ZSH_THEME="robbyrussell"
zsh
eval "$(starship init zsh)"
plugins=(
  git
  fast-syntax-highlighting
  zsh-autosuggestions
)
source $ZSH/oh-my-zsh.sh

重点讲一下 fast-syntax-highlighting

安装：

git clone https://github.com/zdharma-continuum/fast-syntax-highlighting.git ${ZSH_CUSTOM:-$HOME/.oh-my-zsh/custom}/plugins/fast-syntax-highlighting

fast-syntax-highlighting 比 zsh-syntax-highlighting 更好的地方在于更多语法高亮支持，比如

image.png

VS

image.png

虽然核心卖点是 fast，但是一般命令行不会太长，我也没感觉出差异。

7. 快速生成模板代码：自定义 VSCode snippets 📝 # 体验 +10%

推荐一篇文章就够了 一个案例学会 VSCode Snippets，极大提高开发效率。

结合这个网站快速生成贼方便： snippet-generator.app。

8. 熟悉 Windows 常用命令 📜 # 体验 +5%

clip == pbcopy

clip 等同 macOS pbcopy

Example:

❯ clip < ~/.ssh/id_ed25519.pub

start == open

它能：

  • 用浏览器打开 HTML 文件
  • 打开当前文件夹
start coverage/inde.html

start .

Mac to PC: How to Use the 'open' Command in Windows

9. 熟悉 linux 快捷键 ⌨️

  • ALT + B: 光标往回走一个单词 back
  • ALT + F: 光标往前走一个单测 Forward

更多

  • diff-so-fancy 增强 git diff，让 diff 更可读和突出！直接使用 pnpm i -g diff-so-fancy 然后按照官方文档配置 git config 即可。

更多阅读

avatar
文章
阅读
粉丝