关于dependencies和devDependencies的区别？

在我们使用npm下载各种三方库的时候，都会在package.json中生成devDependencies或者dependencies，那么对于这二者，到底有什么区别呢？

先上一张图

区别

对于我们依赖的这些插件库，有的是我们开发所使用的，有的则是项目所依赖的。对于这个分界线，我们诞生了dependencies和devDependencies，具体却别如下：

devDependencies：开发环境使用

dependencies：生产环境使用

举例说明

例如：webpack，gulp等打包工具，这些都是我们开发阶段使用的，代码提交线上时，不需要这些工具，所以我们将它放入devDependencies即可，但是像jquery这类插件库，是我们生产环境所使用的，所以如要放入dependencies，如果未将jquery安装到dependencies，那么项目就可能报错，无法运行，所以类似这种项目必须依赖的插件库，我们则必须打入dependencies中，这下子都明白了吧。

补充 ：

dependencies：生产和开发都会用到的依赖，最后会被打包到项目中。eg：npm i jquery -S
devDependencies ：只在开发环境中使用的依赖，最后不会被打包到项目中。eg：npm i webpack -D
知道了这两者的定义，那么到底什么时候用哪种呢？下面给出具体说明：

如果这个依赖从开发到上线（生产）都需要使用，那么就使用–save或-S，例如，jquery、vue、axios、html2canvas等
如果这个依赖只是开发的时候要用，上线之后就不需要了，就可以使用–save-dev或-D，这样做有利于减小项目体积。例如开发项目中要用到的webpack及其插件，各种加载器如url-loader、sass-loader，各种babel转译插件如babel-core ……。这些依赖只是开发时候用到的工具，生产环境下就不需要了