目录
前言
npm link是一个很有价值的东西,它可以通过关联的形式替代不停去更新npm仓库包,调试自己的模块,在我们开发自己的模块或者框架时肯定需要用到,接下来就跟着我来学习一下吧。
创建项目
首先我们先创建一个简单项目peoject1,我喜欢加上"type": "module"使用es6模块。
package.json
{ "name": "project1", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC", "type": "module" }
我们创建一个简单模块
// peoject1/index.js export const str = 'hello world!'
我们都知道如果我们需要在当前项目中使用该模块需要引入。
// peoject1/test.js import {str} from './index.js' console.log(str)
$ node test.js hello world!
那么出现个问题,如果我需要在其他项目引入呢?
我们再创建一个项目peoject2。
package.json
{ "name": "project2", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], "author": "", "license": "ISC", "type": "module" }
我们尝试引入project1。
// peoject2/test.js import {str} from 'project1' console.log(str)
一定会发现报错了,因为peoject1这个包不存在:Error [ERR_MODULE_NOT_FOUND]: Cannot find package 'project1' imported from ...
这时候你肯定想的到我们只要把project1打包到npm仓库再下载到peoject2就好了。
但是我们万一peoject1项目目前开发阶段需要频繁修改呢?我们不能一直靠重复打包来处理吧。
于是我们可以考虑使用npm link。
npm link关联项目
我们回到project1
$ npm link added 1 package in 1s
会提示你添加了一个包,添加在哪里了呢?npm全局包的位置。
npm全局包默认位置:C:\Users\admin\AppData\Roaming\npm\node_modules
接下来再去project2执行关联。
$ npm link project1 added 1 package in 712ms
就会发现这个包被关联进了peoject2的node_modules。
这时候我们就可以正确运行project2的测试代码了。
$ node test.js hello world!
而且更棒的是,此时你在project1修改导出的字符串,project2中关联的包会自动更新,不需要重新进行关联就可以进行调试。
使用pnpm自动关联
全局安装pnpm
packages: - 'packages/*'
这代表什么呢,代表packages文件夹下的所有项目,都可以被很容易的被其他项目自动link,底下声明的文件夹都可以称为workspace。
那我们去packages创建一个新项目,就test2好了。
创建一个简单的模块,暴露一个字符串。
这时候我们想要在test关联test2该怎么做呢?
只要在test的package.json中依赖加入对应的workspace下的项目就好了。
"dependencies": { "test2": "workspace:*" }
然后在根项目test执行pnpm i,就会自动关联test2到test了。
$ pnpm i Scope: all 2 workspace projects Already up-to-date dependencies: + test2 1.0.0 <- packages\test2
同样创建一个test.js测试
$ node test.js hello world!