NPM 包调试

npm link

官方文档祭天

主项目(main-project)

调试的npm包(test-module)

main-project 中引入test-module,如下图:

main-project

运行主项目,可想而知会报错:

error

因为:main-project的node_modules下面并没有test-module

怎么才能在主项目和调试的npm包之间建立链接呢:

  • 将调试的npm包链接到本地全局目录(node_modules)下面
npm link

如下图:

npm link
  • 在主项目中引用上一步挂到全局的软链接
npm link test-modules

如下图:

npm link test-modules

主项目node_modules中的test-module模块 对应的是 本地的全局node_modules目录下的软链接
而本地的全局node_modules目录下的软链接 对应的是 本地的test-module项目

本地的全局node_modules目录下的软链接将本地的主项目和test-module项目链接起来了

重新启动主项目就不会报错了:

npm link 实际上是在调试的npm包和主项目之间进行软链接

注:对于 npm link 方式,由于主项目和test-module项目属于不同的项目,都有自己各自的 node_modules,如果两个项目都使用了同一个依赖,它们会在各自的 node_modules去查找,如果这个依赖不支持多例,应用就会异常。如果两个项目的编译规则不匹配,也同样会出问题。而且webpack不会对test-module项目做预编译,可能会导致实际构建或者运行时会报错等

  • 删除引用和删除软链接
    npm unlink test-module:删除引用

npm unlink:删除软链接

yalc

官方文档祭天

  1. yalc publish --private
  1. yalc add [my-package]
  1. 在主项目下会生成:

添加了yalc.lock文件,package.json对应的包名会有个地址为file:.yalc/开头的项目。

yalctest-module的包依赖提升至main-project中,在全局添加test-module依赖,在main-project下新建文件拉取依赖,即使有共同的依赖也会从main-project的 node_modules 去查找。使用 yalc 可以避免上面 npm link 的依赖问题

nodemon

现在还有一个问题,目前写一下代码,需要打一次包, 于是需要自动监听更新文件,可以使用 nodemon,监视文件的更改并执行对应的命令

更多用法可以查看官方文档

想要解决刚刚提出的问题,可以在test-module项目中增加命令


"scripts": {
    "async": "npm run build && yalc push",
    "watch": "nodemon --ignore dist/ --ignore node_modules/ --watch src/ -C -e js,ts,tsx,scss --debug -x npm run async", // 自动监听
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。