使用Lerna进行项目管理

731 阅读3分钟

lerna管理脚手架搭建流程

仓库地址

  1. 项目初始化
    • npm项初始化
      • npm init -y
      • 新建.gitignore文件
      • lerna init
    • 创建lerna管理的包
      • core:脚手架执行文件(类似于@vue/cli脚手架)
        • core需要引用utils工具包
      • utils:工具包
    • 给core和utils创建依赖
      • lerna add lodash
      • lerna link 处理依赖
  2. 脚手架开发和测试
    • lerna exec -- rm - rvf node_modules
    • lerna run test
      • 相当于执行每个packages下lerna包的npm命令
      • lerna run --scope @rainbow-cli-dev/utils test
  3. 脚手架发布上线
    • lerna version
    • lerna changed
    • lerna diff
    • lerna publish

image.png

项目初始化

- mkdir rainbow-lerna-cli
- npm init -y
- lerna init

rainbow@rainbow-lerna-cli % lerna init
lerna notice cli v4.0.0
lerna info Initializing Git repository
lerna info Updating package.json
lerna info Creating lerna.json
lerna info Creating packages directory
lerna success Initialized Lerna files

lerna初始化干了什么:

  1. 创建了git仓库
  2. 更新了package.json
  3. 新增lerna.json
  4. 创建packages目录进行包管理

查看lerna.json

//所有的包管理都在packages目录下
{
  "packages": [
    "packages/*"
  ],
  "version": "0.0.0"
}

创建lerna管理的npm包

lerna add core 根据提示设置core的package name为:@rainbow-lerna-cli/core lerna add utils 根据提示设置core的package name为:@rainbow-lerna-cli/utils

解决本地依赖

  • 在core/bin/index.js引用本地未发布的依赖包@rainbow-lerna-cli/utils
  • 在core的package.json中添加@rainbow-lerna-cli/utils依赖;
  • lerna link 解决本地依赖关系 image.png

新增远程依赖

  • lerna add loadash

image.png

也可以给某个包单独安装依赖包 image.png

开发和测试

  • lerna exec --scope @rainbow-lerna-cli/core chmod 777 ./bin/index.js
  • lerna exec --scope @rainbow-lerna-cli/core ./bin/index.js

image.png

发布上线

  • npm平台新建包组 image.png image.png

  • git上传项目

    • git remote add origin https://gitee.com/rainbowdiary/rainbow-lerna-cli
    • git push报错 报错 fatal: refusing to merge unrelated histories
    • git pull origin master --allow-unrelated-histories
    • git push --set-upstream origin master
  • 查看包的相关情况

    • lerna version 给npm包绑定版本
    • lerna changed 查看git改动
    • lerna publish 发布npm包 image.png
  • 出现No changed说明要修改下文件才能上传,然后git commit image.png

image.png

  • lerna publish会出现很多问题,使用@包组的形式发布,默认都是私有包,private packages 解决:npm login image.png

给npm包的package.json文件添加配置: image.png

  • 报错git tag已经存在,虽然npm没有发布成功,但是每次lerna publish都会往gitee上新建一个tag

  • 解决:修改pakcage.json的vesion image.png

  • 报错:E426 426 Upgrade Required

  • 解决:查了网上的资料,说是 最终发生错误的原因:2021年10月4日后,npm 网站和 npm registry 必须使用 TLS 安全套接层 1.2 版本,所以需要升级对应版本。 悲催的是今天是2021.11.07号这个规定才出来不久

//需要操作
npm install -g https://tls-test.npmjs.com/tls-test-1.0.0.tgz 
npm config set registry https://registry.npmjs.org
//又报错 npm WARN npm npm does not support Node.js v14.3.0
// 查了网上的资料说是node版本和npm版本不一致导致的。
//解决:查看自己的node版本是v14.3.0,查看网址:https://nodejs.org/zh-cn/download/releases/ 找到Node.js v14.3.0对应的npm版本
npm i -g npm@6.14.8
npm config set registry https://registry.npmjs.org
// 这才终于成功了

image.png

终于成功了~ image.png 查看npm平台 image.png

上线测试

  • npm unlink删除本地调试
  • npm i -g @rainbow-lerna-cli/core
// 这是@rainbow-lerna-cli/core包中package.json文件的bin配置
 "bin": {
    "rainbow-cli": "bin/index.js"
  }

所以使用rainbow-cli命令测试

  • 报错:Error: Cannot find module '@rainbow-lerna-cli/utils'

image.png

image.png

  • devDependencies依赖没有被安装 image.png

  • 解决:尝试将@rainbow-lerna-cli/utils依赖放在dependencies中,发现解决了 image.png

image.png

  • 如果你遇到npm报错:Error: ENOENT: no such file or directory, uv_cwd
  • 解决:重启一下终端就好了
Error: ENOENT: no such file or directory, uv_cwd\
at Error (native)\
at Object.resolve (path.js:1142:25)\
at Function.Module._resolveLookupPaths (module.js:390:17)\
at Function.Module._resolveFilename (module.js:460:31)\
at Function.Module._load (module.js:417:25)\
at Module.require (module.js:497:17)\
at require (internal/module.js:20:19)\
at /usr/local/lib/node_modules/npm/bin/npm-cli.js:25:13\
at Object.<anonymous> (/usr/local/lib/node_modules/npm/bin/npm-cli.js:75:3)\
at Module._compile (module.js:570:32)

image.png