快速打开 npm 包小技巧

背景

前段时间跟同事一起查问题的时候，发现他打开 npm 包的方式是直接从命令行中输入命令 npmView xxx(包名)，感觉非常快捷，而我总是只能，打开浏览器 -> 输入 npm xxx 搜索 -> 进入 npm 页面，差就差了好几步，而且感觉动作甚至有些笨拙。

实现

虽然想想就知道是借助环境变量 alias 来实现的，但其实本身对于一些 bash 之类的脚本根本不熟悉，只知道 mac 中可以通过 open https://www.npmjs.com/package/egg 以及 windows 中可以通过 start https://www.npmjs.com/package/egg 打开页面。

但是显然如果要实现 npmView egg 就打开页面还是需要有变量的替换以及判断的。

mac

在 mac 场景中实现会快捷许多，这里首先默认大家都装了 zsh。

打开终端输入 vim ~/.zshrc

在文件中添加如下代码：

view_npm() {
  if [[ -n $2 ]]; then
    # 如果带了版本号就直接拼上版本号的路由
    open "https://www.npmjs.com/package/$1/v/$2"
  else
    open "https://www.npmjs.com/package/$1"
  fi
}

alias npmView=view_npm

保存文件后执行 source .zshrc

然后在终端输入 npmView egg 或者 npmView egg 3.20.0 就能看到效果啦~

windows

本人对于 windows 实在不熟悉，但是还好有 gpt...

在 windows 中我们可以写一个批处理脚本

在任意位置创建一个名为 npmView.txt 的记事本，在文件中写入如下内容

@echo off
set package=%1
set version=%2

if "%version%"=="" (
    start https://www.npmjs.com/package/%package%
) else (
    start https://www.npmjs.com/package/%package%/v/%version%
)

而后重新命名为 npmView.bat

PowerShell

在 powerShell 中创建 alias

打开 PowerShell 窗口，输入 echo $PROFILE，会出现如下路径，这个是 PowerShell 的配置文件

打开该文件，在文件中写入如下内容

Set-Alias npmView -Value "上一步保存的 npmView.bat 的绝对路径"

然后关闭 PowerShell 并重新打开

然后在终端输入 npmView egg 或者 npmView egg 3.20.0 就能看到效果啦~

CMD

由于 cmd 中没有 alias 的能力，推荐使用能力更强的 powershell，如果非要在 cmd 中使用，你需要把 npmView.bat 保存到 PATH 中的某个目录（例如 C:\Windows 或 C:\Windows\System32），而后打开 cmd 。

在终端输入 npmView egg 或者 npmView egg 3.20.0 就能看到效果啦~

如果对你有所帮助，期待你的点赞~