前端开发环境、⽣产环境、测试环境的基本理解和区别
开发环境：开发环境是程序猿们专门⽤于开发的服务器，配置可以⽐较随意， 为了开发调试⽅便，⼀般打开全部错误报告。
开发环境：
测试环境：⼀般是克隆⼀份⽣产环境的配置，⼀个程序在测试环境⼯作不正常，那么肯定不能把它发布到⽣产机上。
测试环境：
⽣产环境：是值正式提供对外服务的，⼀般会关掉错误报告，打开错误⽇志。
⽣产环境：
三个环境也可以说是系统开发的三个阶段：开发->测试->上线，其中⽣产环境也就是通常说的真实环境。
开发环境与⽣产环境分离的原因如下：
在开发时，不可避免会产⽣⼤量debug⼜或是测试的代码，这些代码不应出现在⽣产环境中（也即不应提供给⽤户）。
在把页⾯部署到服务器时，为了追求极致的技术指标，我们会对代码进⾏各种各样的优化，⽐如说混淆、压缩，这些⼿段往往会彻底破坏代码本⾝的可读性，不利于我们进⾏debug等⼯作。
数据源的差异化，⽐如说在本地开发时，读取的往往是本地mock出来的数据，⽽正式上线后读取的⾃然是API提供的数据了。
如果硬是要在开发环境和⽣产环境⽤完全⼀样的代码，那么必然会付出沉重的代价，这点想必也不⽤多说了。
─fig.js# ⽣产环境的webpack配置⽂件（⽆实质内容，仅为组织整理）
dependences是项⽬正常运⾏所需要的依赖，⽽devDependencies则是开发者开发时整个项⽬所需的依赖（如会有⼀些测试依赖之类的）。
1
会默认安装两种依赖。
如果你只是单纯的想使⽤这个包⽽不需要进⾏⼀些改动测试之类的操作，则运⾏：（只安装dependencies⽽不安装devDependencies。）npminstall--production
1
如果想要安装devDependencies，则运⾏：
npminstallpackagename--dev
angular和angularjs
dependencies就是你程序跑起来需要的模块，没有这个模块你程序就会报错。
devDependencies见命知意了，开发程序的时候需要的模块了。
举个例⼦，你⽤angularjs框架开发⼀个程序，开发阶段需要⽤到gulp来构建你的开发和本地运⾏环境。所以angularjs⼀定要放到dependencies⾥，因为以后程序到⽣产环境也要⽤。gulp则是你⽤来压缩代码，打包等需要的⼯具，程序实际运⾏的时候并不需要，所以放到dev⾥就ok了。
再深⼊⼀些，你写程序要⽤ES6标准，浏览器并不完全⽀持，所以你要⽤到babel来转换代码。程序⾥有消息提⽰，你想⽤toaster。同样⼀个开发⽤，⼀个运⾏⽤。所以babel放dev，toaster放dependencies。
希望你理解了！
简单⼀些可以：
dependencies存放项⽬或组件代码中依赖到的
devDependencies存放测试代码依赖的包或构建⼯具的包
如果你使⽤了⼀些构建⼯具，⽐如webpack之类的，打包的时候，是不会把dev库打进去的。
devDependencies 通常⽤来放我们开发时所⽤到的⼯具，⽐如 Webpack，Gulp，babel等。devDependencies ⾥⾯的插件只⽤于开发环境，不⽤于⽣产环境，⽽ dependencies 是需要发布到⽣产环境的。
浏览器并不会实际的去同步加载这个模块，require的处理是由Webpack进⾏解析和打包的，浏览器只需要执⾏打包后的代码。
将Webpack开发服务器集成到已有服务器
尽管Webpack开发服务器可以直接⽤于开发，但实际项⽬中我们可能必须使⽤⾃⼰的Web服务器。这
就需要我们能将Webpack的服务集成到已有服务器，来使⽤Webpack提供的模块打包和加载功能。要实现这⼀点其实⾮常容易，只需要在载⼊打包⽂件时指定完整的URL地址，例如：
这就告诉当前页⾯应该去另外⼀个服务器获得脚本资源⽂件，在之前我们已经在配置⽂件中指定了开发服务器的地址，因此打包后的⽂件也知道应该通过哪个地址去建⽴Socket IO来动态加载模块。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。