pnpm — Monorepo

最新推荐文章于 2025-03-16 23:33:18 发布
最新推荐文章于 2025-03-16 23:33:18 发布
阅读量759 收藏 2
点赞数
分类专栏： 前端 文章标签： Monorepo 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/sun_shydeo/article/details/126780477
版权
这篇博客介绍了如何使用pnpm工具来设置和管理Monorepo项目。首先，通过npm全局安装pnpm，然后创建Monorepo文件夹和packages子目录。接着，配置pnpm-workspace.yaml文件来定义工作空间。执行初始化命令pnpminit，并使用pnpm add命令添加依赖，如typescript，它会在根目录下生成软链接。最终，展示了完成这些步骤后的目录结构。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

1、安装 pnpm

npm i pnpm -g

2、创建Monorepo管理文件夹，这里命名 Monorepo，并创建packages文件夹

3、创建用于定义工作空间的根目录的yaml文件： pnpm-workspace.yaml，并添加

packages:
  - 'packages/ **'

4、

pnpm init

5、pnpm参数 -w：--workspace-root 添加依赖到根目录，如：

pnpm add typescript -D -w

会生成一个typescript软连接link，真正存储在 .pnpm 文件夹中

node_modules
.pnpm

 

6、最后目录结构

 

全网最详细的从0到1的turbo pnpm monorepo的前端工程化项目[搭建篇]
禅思院
02-18 1285
本文从实战出发，初步单间一个为 turbo的基础项目工程项目，本文我估计，是全网唯一一个手把手第一次真正从0到一的完整的教程，纯属个人见解，因为我没有看到像我这么全的！，本文旨意在搭建一个vue3的组件库，后面还有更多的文章信息，我也不知道后面文章什么时候更新，本人很赖！希望搭建鼓励鼓励我！
全网最详细的从0到1的turbo pnpm monorepo的前端工程化项目[vitePress篇]
禅思院
02-19 799
一个好的工程化项目，必然有一个好的文档管理，这样才算称得上一个好的工程化，也大大提高后面的工作和文档查找的效率！
使用 pnpm 搭建 monorepo 项目
子洋 Blog
03-17 2798
在软件开发中，随着项目的逐渐庞大和复杂化，管理多个相关联的代码库就变成了一项挑战。这时，Monorepo（单体代码仓）应运而生，它能有效管理多个项目或模块。Monorepo 是指在一个单一的版本控制系统仓库中管理多个模块/项目的策略。统一的工作流程和工具链：整个仓库的项目可以共享构建，测试，部署等流程。更容易的代码共享和重用：不同项目之间共享代码变得直接和高效。依赖管理：确保各个模块间依赖的版本一致性。原子性提交和版本控制：可以在单个提交中跨多个项目进行更改，简化版本跟踪。
pnpm 实现 Monorepo 一些操作命令
dizuncainiao的博客
04-28 1333
pnpm workspace 相关操作命令~
pnpm monorepo 架构
最新发布
xuukai的博客
03-16 288
pnpm monorepo 是指使用 pnpm 包管理器来管理的单体仓库（Monorepo）项目。它允许在一个代码仓库中管理多个项目或包，这些项目可以是独立的，也可以相互依赖，通过 pnpm 的工作区（workspace）功能来实现高效的依赖管理和构建流程。
pnpm-monorepo-typescript-project-references
04-11
pnpm-monorepo-typescript-项目参考 用过的 pnpm工作区（monorepo） 打字稿项目参考（基于 ，以下列表中的选项3） 理论 从理论上讲-我找不到任何相关信息-项目引用可以在以下模式下使用： 简单的存储库（带有单个项目），项目引用用于将大型代码库拆分为较小的部分 导入是相对的（在'components'子项目中： import foo from '../utilities' ，其中import foo from '../utilities'也是子项目）（无更改） 尝试用一个旧项目进行此操作，实际上，即使是根目录文件夹也很难拆分项目。 我发现了很多循环依赖，并且没有办法用“引用”来描述循环依赖（请让我知道是否应该更正此语句） 单一存储库，无链接（lerna） 所有项目中都需要路径别名（compilerOptions＃paths） 导入是模块化的（
pnpm monorepo的技术选型临界点（Critical adoption）
幻日のヨハネ
11-27 2122
前言 直入正题。之所以要聊聊 pnpm 的技术选型临界点 Critical adoption ，得益于一段时间以来在 pnpm 上的丰富实践和赋能落地积累的经验。 讲道理从 BD douyin 和 infra 团队相关开发者开始在国内推行和宣传，介入 pnpm 社区之后我也是对 pnpm 开始抱着探索的态度。 当然经过一段时间的实践考究，发现 pnpm 只能是属于功大于过，下面我们简单聊聊。 正文 本文的主题是 pnpm monorepo 实践，但是聊之前，我们先捋一捋其他包管理器 npm / yarn ，
pnpm 的 workspace 实现 monorepo 工程
wangqiaojie的博客
08-12 4423
前端多个包管理的的方式一般都是采用`monorepo`的方式去管理，之前都是使用的`lerna`的workspace去管理。这段时间包管理切换到了`pnpm`上，它也有worksapce,可以支持`monorepo`。
全网最详细的从0到1的turbo pnpm monorepo的前端工程化项目[组件篇三]
禅思院
03-06 485
接上文的全网最详细的从0到1的turbo pnpm monorepo的前端工程化项目[组件篇二]，进行详细编写rollup打包脚本
Vue 企业级优雅 - 组件库框架 - 构建 pnpm monorepo 前端开发
SvqiAnaconda的博客
09-20 146
与传统的 npm 或者 yarn 不同，pnpm 通过共享依赖来减少磁盘空间的占用，并且可以提高安装和构建的速度。在本文中，我们将探讨如何使用 Vue 企业级优雅组件库框架，并结合 pnpm monorepo 进行前端开发。Vue 企业级优雅组件库框架是一个基于 Vue.js 的开源框架，旨在提供一套高质量、可复用的 UI 组件集合。现在你可以开始开发和使用组件库提供的丰富组件，快速构建高质量的用户界面。现在，我们可以在 Vue 项目中使用组件库提供的组件了。为实际的组件名称和组件库名称。
全网最详细的从0到1的turbo pnpm monorepo的前端工程化项目[组件篇一]
禅思院
02-28 622
我们在使用第三方各种UI库，比如element、ant design等提供的ui组件，发现他们打包万变不离其宗，看似复杂其实也不复杂，只要明白其中的原理，抽丝剥茧，就很简单啦！本文接上文的工程项目，进行接下来的工作。当然一个人还是很难和大厂推出的产品进行对比，但是我们不是为了对比，我们是为了提高自己，让能力更近一步。很多博客上博主也有很多讲解rollup的网站不是对api的详细抄袭就是对api文档的解释，基本上没有实战的教程；纯属个人见解，感觉写的很模糊，没有实战性！
monosample：使用pnpm并跨多个项目共享一个公共库的示例Monorepo存储库
02-03
单样本 这是使用monorepo样品而位与包重载它表明你是多么容易创建monorepo设置与 每个软件包（ packages/** ）都有自己的自述文件，以解释如何在特定软件包中工作 安装 首先安装 npm i -g pnpm 然后跑 pnpm recursive install pnpm run build:lib 之后，您应该能够解除任何应用程序的限制，您可以在根目录下检查package.json以查看可用的命令 pnpm run dev:api2:website1 pnpm run dev:api2:website2 pnpm run dev:api2:website3
monorepo-lerna-pnpm:全新monorepo = lerna + pnpm构建体验
04-05
单反性激素 全新monorepo = lerna + pnpm构建体验
Pnpm实现Monorepo风格项目搭建
随便写写
06-19 1769
Pnpm实现Monorepo风格项目搭建
【技巧】优雅的使用 pnpm+Monorepo 单体仓库构建一个高效、灵活的多项目架构
qq_65034569的博客
01-21 2430
单体仓库（Monorepo）搭建指南：从零开始单体仓库（Monorepo）是一种将多个相关项目集中管理在一个仓库中的开发模式。它可以帮助开发者共享代码、统一配置，并简化依赖管理。本文将通过实际代码示例，详细介绍如何使用 pnpm 搭建一个单体仓库。
用 pnpm 管理 Monorepo 项目
fk1012的博客
04-11 1445
快速的，节省磁盘空间的包管理工具。
pnpm 管理 monorepo
qq_38916811的博客
07-21 2999
Monorepo是项目管理代码的方式之一，指的是一个大项目中包含了需要小项目或者模块，大概的样子。
Monorepo的入门—— 采用pnpm构建一个demo
z止于至善的博客
07-25 3594
Monorepo大家应该都听过，并且知道一些优秀开源项目都是使用Monorepo的方式管理项目的，比如Vue3、Vite、ElementPlus等，同时这几个项目都是采用pnpm作为包管理工具。
pnpm monorepo架构
03-08
### pnpm 在 Monorepo 架构中的使用方法 在 monorepo 构架中，pnpm 提供了强大的工具来管理多个包之间的依赖关系以及优化构建流程。通过使用 `workspace` 功能，可以有效地管理和维护大型项目。 为了设置基于 pnpm 的 monorepo 项目，需先确认已安装 pnpm[^2]： ```bash npm install -g pnpm ``` 创建一个新的 monorepo 并初始化工作区配置文件 `pnpm-workspace.yaml`: ```yaml packages: - 'packages/*' ``` 此配置指定了哪些目录下的子模块会被视为独立的工作空间成员[^3]。 对于每个单独的应用程序或库，在其根目录下定义各自的 `package.json` 文件，并利用 pnpm 命令来进行开发环境搭建、脚本执行等操作。例如启动应用程序可采用如下命令[^1]: ```bash pnpm run start ``` 当涉及到跨包依赖时，推荐使用 TypeScript project references 来提高编译效率并简化多包间的引用逻辑。 另外，借助于 lerna 或其他类似的工具可以帮助更好地处理版本发布等问题；而 yarn workspaces 则提供了另一种实现方式用于对比不同方案的选择。 #### 配置示例 以下是典型的 monorepo 结构布局： ``` my-monorepo/ ├── packages/ │ ├── app-1/ │ │ └── package.json │ ├── lib-a/ │ │ └── tsconfig.json └── pnpm-workspace.yaml ``` 其中 `app-1/package.json` 可能包含这样的内容： ```json { "name": "@myorg/app-1", "version": "0.0.1", "scripts": { "start": "node ./dist/index.js" }, "dependencies": { "@myorg/lib-a": "^0.0.1" } } ``` 同时，在 `lib-a/tsconfig.json` 中指定与其他项目的关联： ```json { "compilerOptions": {}, "references": [ { "path": "../app-1" } ] } ``` 这样就完成了基本的 monorepo 设置过程，能够支持高效的团队协作与持续集成/部署(CI/CD) 流程。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值