monorepo多项目管理主流实现方式:1.learn + yarn/npm workspace 2.pnpm

news2024/11/24 4:31:55

npm域级包

随着npm包越来越多,而且包名也只能是唯一的,如果一个名字被别人占了,那你就不能再使用这个名字;假设我想要开发一个utils包,但是张三已经发布了一个utils包,那我的包名就不能叫utils了;此时我们可以加一些连接符或者其他的字符进行区分,但是这样就会让包名不具备可读性。

在npm的包管理系统中,有一种scoped packages机制,用于将一些npm包以@scope/package的命名形式集中在一个命名空间下面,实现域级的包管理。

域级包不仅不用担心会和别人的包名重复,同时也能对功能类似的包进行统一的划分和管理;比如我们用vue脚手架搭建的项目,里面就有@vue/cli-plugin-babel、@vue/cli-plugin-eslint等等域级包。

我们在初始化项目时可以使用命令行来添加scope:

npm init --scope=username  //直接修改package.json 的name 为@username/package 也行

相同域级范围内的包会被安装在相同的文件路径下,比如node_modules/@username/,可以包含任意数量的作用域包;安装域级包也需要指明其作用域范围:

npm install @username/package

在代码中引入时同样也需要作用域范围:

require("@username/package")

workspace:

Workspaces是一个通用术语:这些功能支持在一个顶级根包中管理本地文件系统中的多个包(可以自动link本地依赖,无需手动link)。 这组功能弥补了处理来自本地文件系统的链接包的更精简的工作流程。在npm安装过程中自动链接,避免手动使用 npm link 来引用需要符号链接到当前node_modules文件夹中的包。

1.learn + yarn workspace 

使用 yarn 来处理依赖问题,使用 lerna 来处理测试和发布问题。lerna 只负责创建 package 以及 package 的版本控制和拓扑构建(–sort build),开发过程中涉及到安装依赖或者删除依赖等都使用 yarn 的命令。

learn.json配置使用 Yarn 并启用 workspaces:

{

  "npmClient": "yarn",

  "useWorkspaces": "true",

}

在根目录的 package.json 中配置 workspaces,此时 lerna.json 中的 packages 设置会失效,yarn 就会以 monorepo 的方式管理 packages:

{

  "name": "root",

  "workspaces": [

    "packages/*"

  ],

}

这样就相当于依赖管理全部交由 Yarn 来管理了:

依赖初始化和提升:yarn install

给某个 package 安装依赖,比如给 pkgA 安装依赖:yarn workspace pkgA add xxx。不同于lerna add,Yarn 就是正常的包管理器,可以一次装多个依赖

给某个 package 移除依赖,比如移除 pkgA 包的 xxx 依赖yarn workspace pkgA remove xxx

  • yarn workspaces run [add|remove] xxx 给所有 package 中安装或删除依赖,会安装到每个子 package 的 package.json

yarn add -W -D typescript 给 root 安装依赖,会安装到 根目录 package.json -W workspace根目录 -D devDepencies

清理依赖

lerna clean # 清理所有packages的node_modules目录,不能删除根目录的node_modules

yarn workspaces run clean # 执行所有package的clean脚本(需自行写脚本) lerna clean && rm -rf ./node_modules 清除安装的依赖

lerna 在安装依赖时也提供了--hoist选项,相同的依赖,会「提升」到 repo 根目录下安装,但……太鸡肋了,lerna 直接以字符串对比 dependency 的版本号,完全相同才提升,semver 约定在这并不起作用。

yarn 突出的是对依赖的管理,包括 packages 的相互依赖、packages 对第三方的依赖,yarn 会以 semver 约定来分析 dependencies 的版本,安装依赖时更快、占用体积更小(可以semver模糊匹配版本);

通过使用 workspace,yarn install 会自动的帮忙解决安装和 link 问题,yarn install # 等价于 lerna bootstrap --npm-client yarn --use-workspaces

它与 lerna bootstarp 不同的是:

  • yarn install 会将 package 下的依赖统一安装到根目录之下。这有利于提升依赖的安装效率和不同 package 间的版本复用(有些包是需要私有依赖的,而私有依赖会被多个包安装多次,而提升依赖可以解决这一问题)。
  • yarn install 会自动帮助解决安装(包括根目录下的安装)和 packages link 问题(若link不上可手动执行lerna link生成

内部packages项目间相互依赖时是通过link软链来实现的(yarn install/learn link):

  • package添加依赖:"dependencies": {"@my-breeze/tools": "^0.0.1"}  使用:require("@my-breeze/tools")

yarn workspace会在父项目的node_modules目录中创建packages/tools的软连接。子项目相互依赖时不再生成到子项目的node_modules里,向上从父node_modules中查找此软链依赖。

若yarn install报错:error Workspaces can only be enabled in private projects.  package.json增加"private": true

build构建

各个 package 之间存在相互依赖,如 packageB 只有在 packageA 构建完之后才能进行构建,否则就会出错,诸如此类,这实际上要求我们以一种顺序规则进行构建。

lerna 提供了一种方法,可以按照拓扑排序进行顺序执行各 package 下某个 npm script(一般是 build)。

lerna 如何进行这样的拓扑排序呢?在 lerna 中,我们不会明确定义所谓的拓扑排序,我们通过在 package 中引入其他 package 作为依赖来指定拓扑结构。

举例来说,如果 package1 必须在 package2 build 之后才能被 build,那么我们就要将 package1 作为依赖添加到 package2 的 package.json 中。至于选择添加到 dependencies 还是 devDependencies 都可以,取决于具体需求场景,但两者都是可以被 lerna 正确解析的拓扑结构。

最后当拓扑结构都配置好后,我们就通过 lerna 提供的一个 --sort 参数告诉 lerna 要以拓扑顺序的方式执行每一个 package 的某个脚本:

lerna run --sort build

发布

Build后进行npm发布,因为 lerna 会根据 git 动态发布,所以先要确保项目中有 git。更改 package.json 追加 private: true 这一项,这表示当前这个根目录所在的区域是不应该被 npm 发布的。

如果我们使用了类似 @mjz-test/lerna-package-3 这种 scope package 还需要手动给, package 所在目录的 package.json 设置如下信息 "access": "public"

如果全局的 registry 与我们要发布的 registry 不是一个,那么我们还需要给每一个 package 设置 registry:"registry": "https://registry.npmjs.org/"

git commit -m "second commit"

lerna publish [param]

结果报错, 原因是我们用了 scope package 与 普通 package 不同的是,scope package 需要到 npm 官网创建 scope 命名空间,(实际就是进入npm orgization 来创建一个组织,组织就叫做 mjz-test

如果当前最大版本是修订版本(0.0.x)那么即使只有一个 package 改动也会导致所有的 packages 都升一级版本即

上一次 publish 后版本

@mjz-test/lerna-package-1@0.0.1

@mjz-test/lerna-package-2@0.0.1

@mjz-test/lerna-package-3@0.0.1

更新 lerna-package-2 后版本

@mjz-test/lerna-package-1@0.0.2

@mjz-test/lerna-package-2@0.0.2

@mjz-test/lerna-package-3@0.0.2

如果当前最大版本是小版本或者大版本,那么只有改动的这个 package 会升级

上一次 publish 后版本

@mjz-test/lerna-package-1@0.1.0

@mjz-test/lerna-package-2@0.1.0

@mjz-test/lerna-package-3@0.1.0

更新 lerna-package-2 后版本

@mjz-test/lerna-package-1@0.1.0

@mjz-test/lerna-package-2@0.1.1

@mjz-test/lerna-package-3@0.1.0

另外,不需要担心被内部引用 package 的版本如何处理,实际上 lerna publish 会在执行时会将依赖更新过的 package 的 包中的依赖版本号更新

 fixed集中版本号与independent独立版本号

集中版本号(fixed)是默认的模式,其表现是 所有 package 的版本变更都是依据当前 lerna.json 中的 version 来改动的,即:依照上边的例子,第三次在对 lerna-package-1 进行改动,publish 后 lerna-package-1 的版本号会直接从 v0.1.0 升到 v0.1.2 ,这种版本号升级方式有点不利于语义化

独立版本号(independent)可以解决语义化的问题,即每次升级都会逐个询问需要升级的版本号,其基准为自身的 package.json, 配置独立版本号只需更改 lerna.json 的 version: independent 即可

安装learn到项目中
为了项目可以多人协同,lerna 安在全局会比较麻烦,所以首先会将 lerna 安装到workspace的根目录,并将常用的工作流命令存在 scripts 中

yarn add -D -W lerna

"scripts": {# /package.json 中增加如下 脚本

    "lerna:create": "lerna create",

    "lerna:build": "lerna run --stream --sort build",

    "lerna:publish": "lerna publish",

    "lerna": "lerna",

    "clean": "lerna clean && rm -rf ./node_modules"

  },

# clone 下代码后执行安装依赖

yarn install  # 等价于 lerna bootstrap --npm-client yarn --use-workspaces

# 开发完成后执行编译

yarn lerna:build

# commit 更改

git commit -am "xxx commit"

# 提交到代码库与 npm

yarn lerna:publish

# 关于提交到版本库的版本,我们假设当前版本为 0.3.3

yarn lerna:publish major # 0.3.3 => 1.0.0

yarn lerna:publish minor # 0.3.3 => 0.4.0

yarn lerna:publish patch # 0.3.3 => 0.3.4

yarn lerna:publish premajor # 0.3.3 => 1.0.0-alpha.0

yarn lerna:publish preminor # 0.3.3 => 0.4.0-alpha.0

yarn lerna:publish prepatch # 0.3.3 => 0.3.4-alpha.0

yarn lerna:publish 1.2.3 # 0.3.3 => 1.2.3 # 也可以是具体的版本号

yarn lerna:publish # 如果什么都不传,则在没有开启 conventionalCommits 的时候弹出命令行提示选择要升级的版本,如果开启了 conventionalCommits 则会根据 commit 信息的 type 做简单的判断输出一个合适的版本

2.learn + npm workspace

amis使用的是learn + npm workspace

NPM 在 7.x 及以上版本中也支持了 Workspace 特性,能力与 Yarn Workspace 基本类似,只是语法不同,同样先更改 lerna.json 开启 workspaces:

{

  "useWorkspaces": "true", //默认就是npm

}

根目录的 package.json 中配置 workspaces:

{

  "name": "root",

  "workspaces": [

    "packages/*"

  ],

}

同样learn 只负责创建 package 以及 package 的版本控制和拓扑构建(--sort build),开发过程中涉及到 安装依赖或者删除依赖等都使用 npm 的命令

依赖初始化和提升:npm install

安装依赖,比如给 pkgA 安装依赖:npm install xxx -w pkgA

移除依赖,比如移除 pkgA 包的 xxx 依赖:npm uninstall xxx -w pkgA

3.pnpm + changesets(发布版本控制)

pnpm 推荐了两个开源的版本控制工具:changesets、rush

为什么要使用pnpm,而不是最常见的 lerna + yarn workspace 呢?

pnpm 比 npm 和 yarn 更快。pnpm 支持像 nvm 这样的 Node 版本管理功能。

相比其他主流包管理器,pnpm 更轻量、更小。有时候我们并不需要那么多功能。

lerna + yarn 的配置有时过于复杂。就 monorepo 实践而言,pnpm 天生具备这种能力(多包管理),而 lerna + yarn 只是借用了一些能力实现了类似功能。

首先要先裝 pnpm

npm install -g pnpm

初始化项目

pnpm init

 monorepo 类型的项目,pnpm 提供了 workspace 来支持,而且比yarn workspace配置更简单,只需在项目根目录下创建一个 pnpm-workspace.yaml 文件:

packages:

  - 'packages/**'  # 所有在 packages 子目录下的 package

  - '!**/test/**' # 不包括在 test 文件夹下的 package

依赖管理全部交由 pnpm 来管理了:

pnpm add <package_name> --filter <workspace_name> // 安装某个特定属性  root项目目录下:pnpm install -D @sicons/fluent --filter @ecdesigner/xstate

pnpm i // 全局安装

pnpm i <package_name> --filter <workspace_name> // 安装某个特定属性

删除全局和每个workspace的node_modules

pnpm clean

pnpm -r exec rm -rf node_modules

pnpm rimraf  **/node_modules

在 monorepo 项目中,每个模块或包通常会有一些公用的依赖项。如果你使用的是 React 技术栈,每个项目都要安装 React 是否会显得繁琐且占用时间和空间?

在使用 yarn + lerna 时,一种方案是配置自动提升(hoisting),如前面所提到的。这种方案存在依赖滥用的问题,因为一旦提升到顶层,没有任何限制,一个依赖可能被加载到任何顶层 node_modules 中存在的依赖,而不受它是否真正依赖该包以及该包的版本的影响。但在 pnpm 中,无论是否被提升,存在默认隔离的策略,所有这一切都是安全的。

所以建议移除每个子项目的共同依赖,例如 React、lodash 等,并统一将它们放入顶层的 package.json 内

pnpm add -w lodash // -w(--workspace) 添加到workspace的根目录的依赖,它将在所有工作区子包中共享

pnpm add -D -w typescript

启动项目命令集成

当有多个项目在packages的时候,可能需要在每个项目中寻找项目启动的命令,所以可以集成在根目录下面的package.json里面

"scripts": {

    "dev:app1": "pnpm start --filter \"@mono/app1\"",

    "dev:app2": "pnpm start --filter \"@mono/app2\""

},

packages中的项目内部互相使用(pnpm install安装依赖,workspace:* 指明这是工作区的依赖,防止自动去 npm 上寻找导致混乱):

"dependencies": { "@mono/app2": "workspace:*"  }

限制只允许使用pnpm安装(只需在 package.json 中加入一行代码来限制):

"scripts": { "preinstall": "npx only-allow pnpm"   } //preinstall 是包安装工具的 钩子函数,在上例中作为 install 之前的拦截判断 (执行顺序:preinstall install postinstall)

创建新项目 & build构建

在这个模板中新添加一个包,操作流程如下:

cd ./packages

mkdir ecdesigner-main && cd ecdesigner-main

pnpm create vite ecdesigner-main --template vue  // 基于vite脚手架 创建 vue3项目

pnpm exec  //在项目范围内执行 shell 命令

pnpm -r, --recursive // 在工作区的每个项目中运行命令。如果您希望即使在运行脚本时也包含根项目,请将include-workspace-root设置设置为true。(.npmrc里的include-workspace-root属性设为true即可,默认为false)

pnpm -r install

pnpm -r run build //pnpm默认按拓扑执行

pnpm exec -r rm -rf node_modules

charset版本控制 & 发布版本:

pnpm add @changesets/cli -w

npx changeset init

npx changeset add //添加一个changeset,按照提示进行操作即可

  Which packages would you like to include? · @xinchen/test1, @xinchen/test2

  Which packages should have a major bump? …

  all packages

    @xinchen/test1@0.0.2

    @xinchen/test2@0.0.2

  Are you sure you want to release the first major version of @xinchen/test1? (Y/n) › true

  Please enter a summary for this change (this will be in the changelogs).

    (submit empty line to open external editor)

  Summary · 测试更改日志

npx changeset version //生成最终的 CHANGELOG.md 还有更新版本信息

npx changeset publish //发布

monorepo 是在一个项目中管理多个包的项目组织形式。它能解决很多问题:工程化配置重复、link 麻烦、执行命令麻烦、版本更新麻烦等。

lerna 在文档中说它解决了 3 个 monorepo 最大的问题:

不同包的自动 link

命令的按顺序执行

版本更新、自动 tag、发布

这三个问题是 monorepo 解决的核心问题。

第一个问题用 pmpm workspace、npm workspace、yarn workspace 都可以解决(install时会自动帮你完成内部link,支持workspace协议声明依赖)。

第二个问题用 pnpm exec 也可以保证按照拓扑顺序执行(pnpm 默认就是--sort按拓扑排序),用 npm和 yarn 不支持拓扑顺序执行(需借助learn拓扑执行lerna run --sort build)。

第三个问题用 changesets 也可以做到。

lerna 在功能上和 pnpm workspace + changesets 并没有大的差别,主要是它做了命令缓存、分布式执行任务等性能的优化。

总之,monorepo 工具的核心就是解决这三个问题。

npm link 的流程实际上是这样的:npm 包先 link 到全局,再 link 到另一个项目的 node_modules。

而 monorepo 工具都是这样做的:

比如一个 monorepo 项目下有 a、b、c 三个包,那么 monorepo 工具会把它们 link 到父级目录的 node_modules。

node 查找模块的时候,一层层往上查找,就都能找到彼此了,就完成了 a、b、c 的相互依赖。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1265738.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

仿美团外卖源码/在线外卖平台源码PHP/支持多商户+多样化配送费+本土外卖+支持第三方配送

源码简介&#xff1a; 进云仿美团外卖源码&#xff0c;作为外卖平台源码&#xff0c;它不仅支持多商户、多样化配送费、本土外卖&#xff0c;还支持第三方配送。 进云仿美团外卖源码是一个进云源生插件&#xff0c;支持多商户多样化配送费模式本土外卖平台支持第三方配送&…

浅谈安科瑞网络电力仪表在斯里兰卡某项目的应用

摘要&#xff1a;安科瑞APM系列网络仪表适用于高低压柜&#xff0c;进线以及出线处的全电量测量及监测。 Absrtact: APM series of network power meter are suitable for full power measurement and monitoring of high and low voltage cabinets, incoming and outgoing li…

简洁、高效、灵活:探索 Spring 同级别的编程框架

文章目录 GrailsMicronautVert.xQuarkusPlay FrameworkDropwizard 前些天发现了一个巨牛的人工智能学习网站&#xff0c;通俗易懂&#xff0c;风趣幽默&#xff0c;忍不住分享一下给大家。点击跳转到网站。 作为一个Java开发者&#xff0c;Spring框架应该基本上都用过的&#x…

Docker容器网络模式

1.none网络 1&#xff09;使用默认网络模式创建一个BusyBox容器&#xff0c;用于对比none网络模式&#xff1b; 测试网络&#xff0c;可以正常连接外网。 2&#xff09;再创建一个none网络模式的BusyBox容器&#xff1b; 测试网络连接&#xff0c;无法连接外网。 总结&#x…

C++:C++11新特性---右值引用

文章目录 初始化方式显示查看类型initializer_listdecltype左值引用和右值引用move左右值引用的场景 万能引用和完美转发 本篇总结C11新特性 初始化方式 C11对参数列表的初始化有了更明确的定义&#xff0c;可以这样进行定义 // 列表初始化 void test1() {// 旧版本int x 0…

前端大屏适配几种方案

记录一下前端大屏的几种适配方案。 我们是1920*1080的设计稿。 目录 目录 一、方案一&#xff1a;remfont-size 二、方案二&#xff1a;vw&#xff08;单位&#xff09; 三、方案三&#xff1a;scale&#xff08;缩放&#xff09;强烈推荐 1、根据宽度比率进行缩放 2、动…

点云凹凸缺陷检测 最高层点云 点云聚类

文章目录 0. 数据说明1. 凹凸缺陷基本内容2. 详细检测思路 结果&#xff1a; 0. 数据说明 如上图所示&#xff0c;需要检测的内容为红色框内标出的缺陷部分。简单示例如下红色线条。 但是&#xff0c;由于噪声的影响&#xff0c;点云的平面度并不好&#xff0c;且横梁边缘处存…

4/150:寻找两个正序数组的中位数⭐

题目&#xff1a;寻找两个正序数组的中位数 给定两个大小分别为 m 和 n 的正序&#xff08;从小到大&#xff09;数组 nums1 和 nums2。请你找出并返回这两个正序数组的 中位数 。 算法的时间复杂度应该为 O(log (mn)) 。 题解1&#xff1a;暴力 暴力思路简介&#xff0c;…

在数据库中进行表内容的修改(MYSQL)

根据表中内容&#xff0c;用命令语句创建数据库&#xff0c;表格&#xff0c;以及插入&#xff0c;修改&#xff0c;删除表格中的内容。 创建数据库&#xff1a;zrzy mysql> create database zrzy; 引用zrzy数据库&#xff1a; mysql> use zrzy; 创建student_info表&…

蓝桥杯day02——移动机器人

1.题目 有一些机器人分布在一条无限长的数轴上&#xff0c;他们初始坐标用一个下标从 0 开始的整数数组 nums 表示。当你给机器人下达命令时&#xff0c;它们以每秒钟一单位的速度开始移动。 给你一个字符串 s &#xff0c;每个字符按顺序分别表示每个机器人移动的方向。L 表…

随时随地,打开浏览器即可体验的在线PS编辑器

即时设计 即时设计是国产的专业级 UI 设计工具&#xff0c;不限平台不限系统&#xff0c;在浏览器打开即用&#xff0c;能够具备 Photoshop 的设计功能&#xff0c;钢笔、矢量编辑、矩形工具、布尔运算等设计工具一应俱全&#xff0c;是能够在线使用的 Photoshop 免费永久工具…

Redis实战命令

实战命令 单值缓存 set key value get key 对象缓存 &#xff08;1&#xff09;set user:1 value(json格式) &#xff08;2&#xff09;mset user:1:name junfeng user:1:age 18 mget user:1:name user:1:age 分布式锁 分布式锁解决了什么问题&#xff1f; 分布式锁解…

63 权限提升-Linux脏牛内核漏洞SUID信息收集

目录 演示案例:Linux提权自动化脚本利用-4个脚本Linux提权SUID配合脚本演示-AliyunLinux提权本地配合内核漏洞演示-MozheLinux提权脏牛内核漏洞演示-Aliyun&#xff0c;Vulnhub涉及资源: linux提权相对windows提权方法相对少一些&#xff0c;linux提权方法相对来讲有七八种方式…

WIFI HaLow技术引领智能互联,打破通信限制

在过去十年里&#xff0c;WIFI技术已在家庭和企业中建立起了庞大的网络&#xff0c;连接了数十亿智能互联设备&#xff0c;促进了信息的迅速传递。然而&#xff0c;当前的WIFI标准存在一些挑战&#xff0c;包括协议范围的限制和整体功能的受限&#xff0c;导致在较远距离进行通…

Python开发——工具篇 Pycharm的相关配置,Python相关操作 持续更新

前言 本篇博客是python开发的工具篇相关&#xff0c;介绍pycharm的使用和相关配置&#xff0c;收录python的相关操作&#xff0c;比如如何启动jupyter。 目录 前言引出Pycharmpycharm如何不同等级日志显示不同颜色设置不同pycharm的python环境 Python操作如何启动Jupyter 总结…

SpringBoot : ch11 整合RabbitMQ

前言 在当今的互联网时代&#xff0c;消息队列成为了构建高可靠、高性能系统的重要组件之一。RabbitMQ作为一个可靠、灵活的消息中间件&#xff0c;被广泛应用于各种分布式系统中。 本篇博客将介绍如何使用Spring Boot整合RabbitMQ&#xff0c;实现消息的发送和接收。通过这种…

【测试开发】web自动化测试框架需求设计 !

1、实现目的 基于BS架构&#xff0c;模拟用户&#xff08;鼠标、键盘&#xff09;操作&#xff0c;达到快速、重复执行测试用例&#xff1b; 便于回归测试&#xff0c;快速覆盖主线用例或功能&#xff1b; 线上或线下巡检测试&#xff0c;结合持续集成&#xff0c;及时发现运…

万户协同办公平台ezoffice SendFileCheckTemplateEdit.jsp接口存在SQL注入漏洞 附POC

@[toc] 万户协同办公平台ezoffice SendFileCheckTemplateEdit.jsp接口存在SQL注入漏洞 附POC 免责声明:请勿利用文章内的相关技术从事非法测试,由于传播、利用此文所提供的信息或者工具而造成的任何直接或者间接的后果及损失,均由使用者本人负责,所产生的一切不良后果与文…

解决electron-builder打包不成功只能输出tgz文件的问题

现象&#xff1a; 对应项目里配的指令&#xff1a; 但就是死活不成功&#xff0c;只能输出tgz压缩文件。 最后一咬牙下载了官方的electron-quick-start拿来试试&#xff0c;结果还是一样。 一时间没想法了。 后来突然脑袋灵光一闪&#xff0c;去他妈的直接npx 执行看看&…

geemap学习笔记016:获取图像的基本属性和描述性信息

前言 遥感数据中通常包含众多信息&#xff0c;例如图像获取的时间、云覆盖量、以及每个波段的最大值最小值等等。 1 导入库并显示地图 import ee import geemapMap geemap.Map() Map2 添加图像数据 centroid ee.Geometry.Point([-122.4439, 37.7538]) #创建一个点坐标lan…