webpack配置package.json时devDependencies与dependencies？

Question

最近在学习webpack4的过程中，针对以前从来没有注意过的细节进行深究，发现了一些不是很明白的问题，现在我的package.json配置文件里引用了webpack，webpack-cli，html-webpack-plugin，clean-webpack-plugin，这些都是工具，无需多言，我是打包进devDependencies里面的，然后我再开发index.js的时候，引入了jquery，我开始想，这个理论上是应该放在dependencies里面的，因为生产模式需要，但是如果我放在devDependencies里面会怎么样呢？以下是我不停的实验得出的结论(每一次实验，为确保准确，都彻底删除node_modules文件夹，重新一个一个安装)：
1.放在devDependencies里，mode设置为development（开发模式），打包出的文件可以正常使用jquery；
2.放在devDependencies里，mode设置为production（生产模式），打包出的文件可以正常使用jquery；
3.放在dependencies里，mode设置为development（开发模式），打包出的文件可以正常使用jquery；
4.放在dependencies里，mode设置为production（生产模式），打包出的文件可以正常使用jquery；

{
  "name": "vuetest",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "webpack --config webpack.prod.js",
    "start": "webpack-dev-server --open --config webpack.dev.js"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "clean-webpack-plugin": "^0.1.19",
    "html-webpack-plugin": "^3.2.0",
    "jquery": "^3.3.1",
    "webpack": "^4.16.5",
    "webpack-cli": "^3.1.0"
  }
}

what？
我开始怀疑人生了，我开始不明白dependencies和devDependencies到底是用来干嘛的了，因为我看不到一点点区别，我不明白它存在的意义是什么了，还有与之对应的生产模式和开发模式又是什么？求大神不吝赐教，万分感谢！

Answer 1

实际上呢，webpack打包跟package.json配置文件根本没有半毛钱关系，他只与webpack自身有关，
dependencies和devDependencies只有在特定情况下才有用(比如在Node项目的生产环境上)，
webpack打包是依赖于node_modules文件夹的，只要这个文件夹里有相应的模块，就可以打包，
至于平时为什么写--save和--save-dev是因为团队合作的原因，写进package.json里，才方便团队协作