[ yarn workspace | monorepo ] 坑

[g770728y]

angular子项目问题

重现步骤

mkdir monorepo && cd $_
npm init
编辑package.json
{
    private: true,
    packages: ["modules/*"]
}

ng new angular-proj
cd angular-proj
yarn
yarn build 
报错: 找不到 angular-proj/node_modules/@angular/cli....

原因分析

根据报错信息, 很明显 @angular/cli 应该安装在子项目angular-proj/node_modules里, 不然找不到 经查找, 果不其然, @angular/cli安装在 根项目/node_modules里, 需要下移到angular_proj

解决办法

第一步: 修改angular-proj/package.json

根据 yarn nohoist文档, 在angular_proj/package.json里, 追回如下内容:

"workspaces": {
    "nohoist": ["@angular/cli"]
}

第二步: 删除所有项目的node_modules

此步骤非常 重要!!! 不然不会生效

第三步:

yarn yarn build

---

angular.json

angular.json里, 很多文件的引用都是直接使用node_modules/...绝对路径 这部分文件 均要通过 nohoist 选项, 下移到 子项目 不然build时也会报错 (例如会报 echarts.js 找不到 )

[g770728y]

被引用的包发生修改, 不能自动同步到 主包

现象(注意是偶发的)

例如: 包A引用到包B 1.0.0版 改包B中的内容 包A无论如何都不能自动同步

解决

升级包B的版本....

[g770728y]

确保全局只安装一个npm包的一份版本

现象

写了一个uform-ext包, 它有一个方法, 方法中需要传参数 x main包引用uform-ext包, 并用到了 x = 传参 发现 无论如何, uform-ext包都无法识别Field...

原因

uform-ext包维护了一份单独的uform/antd, 而没有使用到全局的uform/antd

解决

删除uform-ext的node_modules, 重新yarn, 问题解决

[g770728y]

monorepo中开发npm包时, dependencies一定要写全!!

场景

比如你用到了valor-app-utils包:

import `valor-app-utils`;

你的package.json配置是这样的:

dependencies: {}    // 没有valor-app-utils包

或是这样的:

peerDependencies: {
    valor-app-utils: 1.0.0   // 仅配置在peerDependencies中
}
dependencies: {}    // 没有valor-app-utils包

你在yarn sb时, 程序没有任何问题 --- 因为monorepo中别的repo用了valor-app-utils, 并安装在了../../node_modules里 所以npm包默认能定位到

但一旦你运行yarn build, 会发现一堆古怪问题, 这堆问题无一例外是关联到了../../node_modules里, 甚至一堆循环引用问题

分析

你觉得奇怪, 然后在tsconfig.json里配了skipLibCheck: true, 涛声依旧 你更奇怪了: dependencies和peerDependencies已经被external了, 根本不会编译, 怎么会涉及到node_modules呢? 除非...

原因是:

你的代码中用到了 import valor-app-utils, 而valor-app-utils并未包含在dependencies和peerDependencies中 所以不会被external, 而会打包到dist目录中

解决办法很简单:

package.json:
dependencies: {
    valor-app-utils: 1.0.0
}

启示

无论是不是monorepo项目, 都一定要写全dependencies!!!