前面的文章中，webpack.config.js中包含本地调试和线上发布的所有配置，编译后的bundle.js包含所有的代码。当项目变大、代码量变多、配置增加的时候，文件的可维护性会越来越差，是时候对他们进行分离啦~环境分离环境分离主要是区分本地和生产两种环境，本地调试需要能实时看到代码变化，而生产环境需要编译成指定的文件。可以采用两种方式开发环境和生产环境分别定义配置文件，在package.json中定义对应的指令开发环境和生产环境共用配置文件，通过参数来区分环境配置文件分离分别定义用于开发环境的配置文件webpack.dev.js和用于生产编译的webpack.prod.js，再分别通过n

前面的文章中，webpack.config.js中包含本地调试和线上发布的所有配置，编译后的bundle.js包含所有的代码。当项目变大、代码量变多、配置增加的时候，文件的可维护性会越来越差，是时候对他们进行分离啦~环境分离环境分离主要是区分本地和生产两种环境，本地调试需要能实时看到代码变化，而生产环境需要编译成指定的文件。可以采用两种方式开发环境和生产环境分别定义配置文件，在package.json中定义对应的指令开发环境和生产环境共用配置文件，通过参数来区分环境配置文件分离分别定义用于开发环境的配置文件webpack.dev.js和用于生产编译的webpack.prod.js，再分别通过n

前言  最近一直在看vite的源码（传送）,恰逢公司的项目使用的是webpack，正好借此机会做下迁移，并将该过程记录。当前项目使用webpack+vue2对比  这里挑选了一个比较复杂的路由页面，分别使用vite和webpack启动，记录从npmrunstart到页面加载的耗时  vite  webpack基础改造  package.json中新建指令  alias别名    和webpack一样，配置resolve.alias  全局变量注入    使用vite内置的define代替webpack的DefinePlugin  proxy代理    定义server.proxy代替webpa

前言  最近一直在看vite的源码（传送）,恰逢公司的项目使用的是webpack，正好借此机会做下迁移，并将该过程记录。当前项目使用webpack+vue2对比  这里挑选了一个比较复杂的路由页面，分别使用vite和webpack启动，记录从npmrunstart到页面加载的耗时  vite  webpack基础改造  package.json中新建指令  alias别名    和webpack一样，配置resolve.alias  全局变量注入    使用vite内置的define代替webpack的DefinePlugin  proxy代理    定义server.proxy代替webpa

为什么需要mock至于平时开发为什么需要mock数据，应该大多数的同学都非常清楚了；如果前后端同步开发的话，少不了这一步，在需求评审，技术评估等流程通过后，前后端就会约定接口api的字段（但是在部分公司可能会少了这一步），确认接口api字段约定之后，前端就可以通过mockserver去mock数据进行开发了，不需要等后端开发完api接口再去对接，但是有些同学在开发的过程中经常已经把ui弄好了，就在苦苦等后端大哥的接口...白白浪费了不必要的时间，如果可以自己mock数据开发，那等后端接口都好了只需要把域名或者接口前缀换一下再联调一下就万事大吉了。mock数据的方式jsonschema有些同学喜

为什么需要mock至于平时开发为什么需要mock数据，应该大多数的同学都非常清楚了；如果前后端同步开发的话，少不了这一步，在需求评审，技术评估等流程通过后，前后端就会约定接口api的字段（但是在部分公司可能会少了这一步），确认接口api字段约定之后，前端就可以通过mockserver去mock数据进行开发了，不需要等后端开发完api接口再去对接，但是有些同学在开发的过程中经常已经把ui弄好了，就在苦苦等后端大哥的接口...白白浪费了不必要的时间，如果可以自己mock数据开发，那等后端接口都好了只需要把域名或者接口前缀换一下再联调一下就万事大吉了。mock数据的方式jsonschema有些同学喜