npm link详解

Posted on | In , | Visitors:
Words : 856 | Reading ≈ 3 min

npm install 可以把发布在 npmjs 平台上的模块包下载到本地，npm install -g 可以把包下下来的同时，还帮我们配置好全局变量，让我们可以直接使用命令而不是通过 node 来执行或者配置 package.json 的 script 脚本来 run。

但这仅限于已经发布的包，那对于未发布的包，要怎么测试使用呢？难道要把一个未经测试的包发布上去然后 install 下来测试？当然不能这么做，也不用这么做。npm 官方早已考虑到了这一点，给我们提供了测试本地的包的工具指令：npm link。

npm link原理

npm link 可以帮助我们模拟包安装后的状态，它会在系统中做一个快捷方式映射，让本地的包就好像install过一样，可以直接使用。

在mac中，我们在终端可以直接敲的命令，其实是在执行/usr/local/bin目录下的脚本，这个目录可以认为是我们的全局命令所在的地方。

而当我们在npm install -g的时候，其实是将相关文件安装在/usr/local/lib/node_modules目录下，同时在全局命令/usr/local/bin目录下会有一个映射脚本，将其指向/usr/local/lib下的真实文件。这么做的好处是，可以在保证只有一份可执行文件的前提下，给命令取别名。

同样的，npm link 做的事情也是一样，唯一的区别是，它在 /usr/local/lib 下的 node_modules 里不是存的真实的文件，而是存了一个快捷方式，指向你当前执行 npm link 的目录。如果开发的的是node包，则执行的命令名和真实执行的文件入口，会根据项目的 package.json 里 bin 的配置来获取。

如何使用

1
2
cd your-project-dir
npm link

然后会看到输出类似如下的链接信息，说明成功。

1
2
/usr/local/bin/yourpakagename -> /usr/local/lib/node_modules/yourpackagename/xxx
/usr/local/lib/node_modules/yourpackagename/xxx -> /Users/username/Documents/xxx(your real project path)

测试 node 环境下运行的包时，需要使用全局 link​。​并且做npm link之前，需要在 package.json 里配置 bin 字段。

1
2
3
4
# package.json
"bin" : {  
	"your-command-name": "./path-to/your-command-entry-file"
}

然后再在当前目录下进行link

1
2
cd your-command-module
npm link

成功后，就可以直接在终端执行全局命令 your-command-name 了。

link到项目

如果是测试前端包，跑在浏览器环境的，比如 UI 组件库，有两种情况：

  • 当项目和模块在同一个目录下，可以使用相对路径，只需要link一次

    1
    npm link ../xx-module

  • 当项目和模块不在同一个目录下，那需要做两次 link。
    先进入待测试组件库目录，将组件库 link 到全局：

    1
    2
    cd your-ui-lib
    npm link

    之后，再进入要使用该组件库的工程，然后在工程中 link 这个组件库：

    1
    2
    cd your-project
    npm link your-ui-lib

现在你就可以在你的工程中使用这个 ui 组件库，就好像这个 ui 库被 install 到工程中一样。

  • 解除模块全局link
    进入模块目录，然后执行unlink

    1
    2
    cd your-command-module
    npm unlink your-command-module

  • 解除项目和模块link
    进入项目目录，然后执行unlink

    1
    2
    cd your-project
    npm unlink your-ui-lib

GoodLuck！