Yarn与Lerna管理monorepo使用详解

 更新时间:2022年07月07日 15:04:56   作者:我是leon  
这篇文章主要为大家介绍了Yarn与Lerna管理monorepo的使用详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

什么是 Yarn workspace

Yarn workspace 是 Yarn 提供的 monorepo 下,管理依赖的机制。对代码仓库下,多个 package 的依赖,进行管理:将共同的依赖,做 hosting(提升)。这样,可以防止 package 中的包重复安装。 workspace 机制,会在根目录下,统一安装依赖到 node_module,并生成 yarn.lock。单个 package 下,不需要再生成 yarn.lock。

如何使用 Yarn workspace

1.Yarn 启用工作区

yarn config set workspaces-experimental true

命令的含义:添加workspaces-experimental true到系统全局的.yarnrc中。

2.修改根目录的 package.json,添加如下内容:

{
 "private": true,
 ...
 "workspaces": ["packages/*"]
}

配置项含义: private - 禁止发布根目录内容 workspaces - 设置工作区,声明 workspace 中 package 的路径。值是一个字符串数组,支持 Glob 通配符。

Lerna 安装依赖的方式

Lerna 安装依赖的方式,是使用命令lerna bootstrap。 该命令的作用,是 cd 到 package 文件夹下的每个子文件夹,运行npm installyarn install,在子文件夹中生成版本lock文件和node_module,单独对依赖进行管理。

Yarn workspace 与 Lerna 结合

结合的方式

  • 配置 lerna.json
{
 ...
 "npmClient": "yarn",
 "useWorkspaces": true
}
  • 配置 package.json
{
 "private": true,
 ...
 "workspaces": ["packages/*"]
}

角色的分配

Yarn 负责管理依赖,workspace 会自动对 package 的引用 ,设置软链接(symlink),并且软链接仅在当前 workspace 中生效。 Lerna 负责版本的发布工作,对 package 相互之间的依赖,做好版本管理。

好处

减少项目的磁盘占用空间

Yarn 将项目中的共同依赖,提升到根目录下进行安装

自动设置软链接,方便调试

Yarn 的 workspace 会自动对 package 的引用,设置 symlink

  • 所有 package 使用同一个 yarn.lock,更少造成冲突且易于审查

使用

  • 首次安装依赖 lerna bootstrap
  • 安装dependencies依赖 `yarn add -W [pkg]
  • 安装devDependencies依赖 yarn add -D -W [pkg]

-W 的含义: 安装依赖到 workspace -D的含义: 安装依赖到devDependencies`

以上就是Yarn与Lerna管理monorepo使用详解的详细内容,更多关于Yarn Lerna管理monorepo的资料请关注脚本之家其它相关文章!

相关文章

  • Vue学习笔记进阶篇之vue-cli安装及介绍

    Vue学习笔记进阶篇之vue-cli安装及介绍

    这篇文章主要介绍了Vue学习笔记进阶篇之vue-cli安装及介绍,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • Vue 实现从小到大的横向滑动效果详解

    Vue 实现从小到大的横向滑动效果详解

    这篇文章主要介绍了Vue 实现从小到大的横向滑动效果,结合实例形式详细分析了vue.js横向渐变滑动效果的实现步骤、相关操作技巧与注意事项,需要的朋友可以参考下
    2019-10-10
  • VUE Error: getaddrinfo ENOTFOUND localhost

    VUE Error: getaddrinfo ENOTFOUND localhost

    这篇文章主要介绍了VUE Error: getaddrinfo ENOTFOUND localhost,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2018-05-05
  • vue + qiankun 项目搭建过程

    vue + qiankun 项目搭建过程

    这篇文章主要介绍了vue + qiankun 项目搭建,首先是通过cli3构建vue2项目,通过qiankun改造主应用,本文结合实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-03-03
  • vue+element实现下拉菜单并带本地搜索功能示例详解

    vue+element实现下拉菜单并带本地搜索功能示例详解

    这篇文章主要介绍了vue+element实现下拉菜单并带本地搜索功能,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2021-09-09
  • Vue渲染过程浅析

    Vue渲染过程浅析

    这篇文章主要介绍了Vue渲染过程浅析,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-03-03
  • sortable+element 实现表格行拖拽的方法示例

    sortable+element 实现表格行拖拽的方法示例

    这篇文章主要介绍了sortable+element 实现表格行拖拽的方法示例,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2019-06-06
  • 一文带你搞懂Vue3 defineModel中的双向绑定

    一文带你搞懂Vue3 defineModel中的双向绑定

    随着vue3.4版本的发布,defineModel也正式转正了,它可以简化父子组件之间的双向绑定,是目前官方推荐的双向绑定实现方式,下面就跟随小编一起深入了解一下defineModel的使用吧
    2024-02-02
  • vue 引用自定义ttf、otf、在线字体的方法

    vue 引用自定义ttf、otf、在线字体的方法

    这篇文章主要介绍了vue 引用自定义ttf、otf、在线字体的方法,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-05-05
  • Vue表格组件Vxe-table使用技巧总结

    Vue表格组件Vxe-table使用技巧总结

    这篇文章主要给大家介绍了关于Vue表格组件Vxe-table使用技巧的相关资料,文中还介绍了VXEtable展示指定行所遇到得问题,对大家学习或者使用Vxe-table具有一定的参考学习价值,需要的朋友可以参考下
    2022-09-09

最新评论