pnpm — Monorepo

最新推荐文章于 2024-06-12 21:56:50 发布
最新推荐文章于 2024-06-12 21:56:50 发布
阅读量619 收藏 2
点赞数
分类专栏： 前端 文章标签： Monorepo 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Sun_Shydeo/article/details/126780477
版权

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、最后目录结构

 

CodeLines3
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
使用 pnpm 管理全栈、多包 monorepo
分享身边生活经验blog
09-25 5658
那么我们到底在说什么？让我分解一下。它是一个repo，因为它是一个代码存储库。在这种情况下，我们谈论的是 Git 代码存储库，Git 是卓越的主流版本控制软件。这是一个monorepo，因为我们将多个（子）项目打包到一个代码存储库中，通常是因为它们出于某种原因属于一起，并且我们同时处理它们。超过 20 万开发人员使用 LogRocket 来创造更好的数字体验了解更多 →。
vue3+vite+monorepo+qiankun+pnpm+eslint+prettier 框架
08-03
vue3+vite+monorepo+qiankun+pnpm+eslint+prettier vue3+vite+monorepo+qiankun+pnpm+eslint+prettier vue3+vite+monorepo+qiankun+pnpm+eslint+prettier vue3+vite+monorepo+qiankun+pnpm+eslint+prettier vue3+...
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 模板 —— 使用 PNPM 从零搭建 Monorepo，测试 web components 并发布
最新发布
天下布武
06-12 1155
通过 PNPM 创建一个 monorepo（多个项目在一个代码仓库）项目，形成一个通用的仓库模板。这个仓库既可以用于公司存放和管理所有的项目，也可以用于将个人班余的所有积累整合其中。
pnpm 的 workspace 实现 monorepo 工程
wangqiaojie的博客
08-12 4255
前端多个包管理的的方式一般都是采用`monorepo`的方式去管理，之前都是使用的`lerna`的workspace去管理。这段时间包管理切换到了`pnpm`上，它也有worksapce,可以支持`monorepo`。
pnpm学习
顺拐小乌龟的博客
02-06 300
pnpm学习
基于Pnpm+Changesets的Monorepo工具库实战
weixin_43719925的博客
03-14 656
Pnpm 代表（高性能的npm），同 npm 和 Yarn 一样，都属于Javascript包管理安装工具，它较 npm 和 Yarn 在性能上得到很大提升，被称为快速的，节省磁盘空间的包管理工具。Pnpm 还内置支持了 Workspace 功能，能帮助我们更轻松完成包之间的 link 和 build，更好管理Monorepo项目。更多详细了解，可以前往Npm官网 查看。Changesets 是一个用于 Monorepo 项目下版本以及 Changelog 文件管理的工具。
pnpm搭建monorepo环境
UncleMao的博客
05-16 661
pnpm搭建monorepo环境
pnpm的原理和优势（monorepo）
wtswts1232的博客
06-15 390
硬连接：存储的物理磁盘上该文件的地址。比如这个文件是一个硬连接，通过它可以找到物理磁盘上该 mp4 数据的地址。软件连：是一个引用。它存储的是硬连接的地址。简而言之：它保存的是文件路径。如果将原文件删除，通过软链接无法再次打开原文件。
pnpm-monorepo-typescript-project-references
04-11
pnpm-monorepo-typescript-项目参考 用过的 pnpm工作区（monorepo） 打字稿项目参考（基于 ，以下列表中的选项3） 理论 从理论上讲-我找不到任何相关信息-项目引用可以在以下模式下使用： 简单的存储库（带有单个...
monorepo-lerna-pnpm:全新monorepo = lerna + pnpm构建体验
04-05
Lerna和pnpm是两个在Monorepo管理中非常重要的工具。 Lerna是一款用于管理拥有多个包的JavaScript项目的工具，它通过提供命令行接口，简化了在单个Git仓库中维护多个npm包的过程。Lerna的核心功能包括版本管理和...
vue3+vite+monorepo+qiankun+pnpm+vue-i18n、lodash、dayjs、windicss
08-05
vue3+vite+monorepo+qiankun+pnpm+vue-i18n、lodash、dayjs、windicss vue3+vite+monorepo+qiankun+pnpm+vue-i18n、lodash、dayjs、windicss vue3+vite+monorepo+qiankun+pnpm+vue-i18n、lodash、dayjs、windicss ...
pnpm 与monorepo架构
gu2022_3_5_21_23的博客
07-23 360
软链接与硬链接 创建方式： mklink （windows）软链接 ： a、b指向同一个文件 b相当于一个快捷方式硬链接： a、b指向同一个内存地址 某一文件修改，其他文件跟这变化上图所示：安装某依赖，外面带 符号的文件夹只是一个软链接，链接到 .pnpm 的文件夹下面.pnpm 内的依赖又通过硬链接的方式从 本地store拉取 ，查看： pnpm store path；
monorepo模式下的项目开发
一入前端深似海的博客
10-31 490
monorepo模式下的项目开发
Nodejs学习笔记——npm常见命令
403 Forbidden
11-03 1607
npm英文全称：node package manager npm 为你和你的团队打开了连接整个 JavaScript 天才世界的一扇大门。它是世界上最大的软件注册表，每星期大约有 30 亿次的下载量，包含超过 600000 个 包（package） （即，代码模块）。来自各大洲的开源软件开发者使用 npm 互相分享和借鉴。包的结构使您能够轻松跟踪依赖项和版本。 我们平时开发项目都是需要使用npm下载依赖，常见的npm命令总结如下： npm -v：查看npm版本。 npm init：初始化后会出现一个pac
pnpm---高性能的npm
星环
08-27 2897
JavaScript包管理工具pnpm（performant npm更高的性能，更快的依赖安装速度）
Monorepo的入门—— 采用pnpm构建一个demo
z止于至善的博客
07-25 3386
Monorepo大家应该都听过，并且知道一些优秀开源项目都是使用Monorepo的方式管理项目的，比如Vue3、Vite、ElementPlus等，同时这几个项目都是采用pnpm作为包管理工具。
monorepo仓库的创建与使用
抓住IT的尾巴的博客
03-05 1338
使用pnpm创建一个monorepo仓库
yarn、pnpm、npm script传递参数的方式
逆水行舟，不进则退
11-04 2747
Yarn 和 pnpm(或npm) 调用命令时接收参数的方式不同， 例如，在如下 package.json 配置中： { "scripts": { "command": "modern command" }} 当需要执行 modern command --option ： 使用 Yarn 时，需要执行 yarn command --option。 使用 pnpm 时，需要执行 pnpm run command -- --option。 这是因为 pnpm 对于命令参数的处理与 Yarn 并不相同
monorepo pnpm react 如何
05-16
首先，让我们解释一下这些术语的含义： - Monorepo：将多个相关项目放在同一个代码库中的做法。 - PNPM：一种 Node.js 包管理器，类似于 npm 和 yarn。 - React：一个流行的 JavaScript 库，用于构建用户界面。 现在，我们来看一下如何在 Monorepo 中使用 PNPM 和 React： 1. 创建一个 Monorepo 项目，将所有相关项目放在同一个代码库中。 2. 在根目录下创建一个 `package.json` 文件，并添加以下内容： ``` { "private": true, "workspaces": [ "packages/*" ] } ``` 这个配置告诉 PNPM，这是一个 Monorepo 项目，并且它应该将所有 `packages/*` 目录下的包视为一个工作空间。 3. 在 `packages/` 目录下创建一个新的 React 应用程序。你可以使用 `create-react-app` 工具来快速创建一个新项目： ``` npx create-react-app my-app ``` 4. 确保在 `packages/my-app` 目录下有一个 `package.json` 文件，并添加以下内容： ``` { "name": "my-app", "version": "0.1.0", "dependencies": { "react": "^17.0.2", "react-dom": "^17.0.2" }, "devDependencies": { "react-scripts": "^4.0.3" } } ``` 这个配置告诉 PNPM，这个包依赖于 React 和 React DOM 库，并且需要从 `react-scripts` 包中获取开发依赖项。 5. 在 `packages/my-app` 目录下运行以下命令，安装依赖项： ``` pnpm install ``` 6. 在 `packages/my-app` 目录下运行以下命令，启动 React 应用程序： ``` npm start ``` 这就是在 Monorepo 中使用 PNPM 和 React 的基本步骤。你可以使用相同的方法添加其他包和应用程序，并使用 PNPM 管理它们的依赖项。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值