dependencies devDependencies的区别

最新推荐文章于 2024-08-12 15:17:48 发布

前端架构师_555

最新推荐文章于 2024-08-12 15:17:48 发布

阅读量517

点赞数 1

文章标签： json 前端 javascript

本文链接：https://blog.csdn.net/qq_39406460/article/details/127441907

版权

devDependencies 和 dependencies 的区别你真的知道吗

我其实一直都有个疑问？

为什么有时候安装包需要加后缀-D有时候需要加后缀-S,他们有什么区别呢

原来安装包的时候yarn add antd -S 会把包安装到package.json的dependencies里面

在这里插入图片描述

原来安装包的时候yarn add antd -D 会把包安装到package.json的devDependencies里面

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-scReiWz1-1666326741085)(https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/d7a519af8bd44020a7a1c5e41fdc3ed2~tplv-k3u1fbpfcp-watermark.image?)]

那么安装的包放在devDependencies 和 dependencies 里面有什么区别呢

我百度了一下devDependencies 和 dependencies 的区别

得出的结论是

devDependencies用于本地环境开发时候所需要的依赖包。
dependencies用户发布环境，生成上所需要的依赖包

在这里插入图片描述

这是一个访问量很高的博客给出的答案

那么安装在 `devDependencies` 中的依赖，在项目执行 `build` 的时候会不会被打包进 dist 产物中？

其实我安装在devDependencies里面的antd在打包的dist文件里面是可以找到的，说明不管是安装在devDependencies 和 dependencies下面的依赖都会被打包到dist文件中

devDependencies 和 dependencies 的真正区别是什么

其实是在我们自己写npm包的时候，package.json有时候也需要引入一些包，也需要注意是安装在devDependencies 和 dependencies下面。那么安装在devDependencies 和 dependencies下面会有什么区别呢

比如antd组件库，在package.json的dependencies里面引入了loadsh,

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-X8yNfDQ1-1666326741088)(https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/f86f9cec4f78478f98b4a8385b22458f~tplv-k3u1fbpfcp-watermark.image?)]

我自己的项目也引入了loadsh，antd,那么看看我项目的node_modules里面是有lodash文件的，然后也有antd,并且antd目录的node_modules里面也是存在loadsh

在这里插入图片描述

这就得出了一个结论

我们引入的npm包dependencies里面引入的依赖会安装到node_modules里面该包目录下的node_modules里面，devDependencies里面引入的依赖不会安装到node_modules里面该包目录下的node_modules里面。如果antd里面引入的loadsh是4.17.21，我自己项目引入loadsh是6.17.21，那么容易在业务使用中会出现bug。

小结

结论：devDependencies 和 dependencies的区别核心体现在 npm包 中。只要开发的项目是发npm包提供给外部、其他业务项目使用的，需要非常注意依赖的安装地方，因为搞不好很容易在业务使用中会出现bug。而如果只是自己项目用，不需要发npm包的话，把依赖安装到 devDependencies 或者 dependencies 中，实质上是没有任何区别的。