当前位置: 首页 > Web前端 > HTML

npm-纱线-pnpm研究

时间:2023-03-28 11:38:01 HTML

横向比较依赖管理问题npmnode_modules树形结构隐藏依赖重复安装npm>v3node_modulesflattenmode重复引用yarnnode_modulesflattenmode重复引用yarn2(berry)Plug'n'Play每个包压缩成一个zip,**.pnp。js记录包版本和磁盘映射位置vue生态支持不好pnmpnode_modules树结构,操作系统层面的硬链接,避免重复安装yarn2探索yarn2目测是最好的方案,背后有fb背书。使用pnp改造后,项目也可以正常运行。改造步骤如下:查看当前yarn版本$yarn--version1.22.11setting使用yarn2$yarnsetversionberry设置完成后查看yarn的版本号,>3正常:$yarn--version3.0.0configureyarn-berry.cjs$yarnconfigsetnpmRegistryServerhttps://registry.npm.taobao.org删除旧的node_modules文件夹和yarn.lock文件,并重建整个项目:$rm-rfnode_modules$rm-fyarn.lock$yarnstartprojectyarnserve/start/build...,处理yarn报的依赖错误,一般是因为之前的一些依赖没有在package.json中声明,yarninstallxxx可以解决shell错误,如果浏览器可以正常运行处理项目后,改造完成。如果浏览器控制台报错:Error:Yourapplicationtriedtoaccessxxxxxx,butitisn'tdeclaredinyourdependencies;这使得require调用变得模棱两可且不合理。如果package.json不包含,则yarninstall,如果安装后还是报错,修改.yarnrc.yml,添加如下内容:#包名/版本号自行处理packageExtensions:'mmnn@*':dependencies:'xxyy':'*'添加后执行yarninstall,然后重新运行项目yarn2插件插件列表建议至少安装typescript插件in#自动添加@types依赖$yarnpluginimporttypescriptideSupport:以vscode为例:$yarndlx@yarnpkg/sdksvscode然后:更改你的VSCode工作区配置以添加以下内容:"typescript.tsdk":".yarn/sdks/typescript/lib"至此,ide可以正常对ts进行静态类型推断,也可以通过js依赖进行解析。以上步骤如果需要修改tsconfig.json,需要修改tsconfig.json等流程。但是,问题来了:vue文件中vetur提供的所有类型推断都不生效。

yarn2vue生态支持不好猜测如下:yarn2pnp文件系统是基于zip压缩包的,vetur没有也没有计划providesupport123yarn2是reactfb开源的东家是的,默认不理vue很正常?
[[1]Vetur无法使用通过YarnBerry(PnP)安装的Prettier#2092](https://github.com/vuejs/vetu...)
[[2]yarn@berry支持](https://github.com/vuejs/vetu...)
[[2]支持yarnpnp模式](https://github.com/vuejs/vetu...)Yarn2暂时不可用,考虑pnpmpnpmvsnpm(使用端项目演示,项目小,效果不是很明显)pnpmnpmnode_modulesvolumenode_modulesfilenumberdevserver启动时间devserver单编译包迁移到pnpm开发环境几乎没有变化,安装pnpm,去掉node_modules文件夹,pnpminstall也就是可以,日常使用和npm差不多