夜已深，才能静下心写点东西分享给各位。

各位小伙伴平时工作中用webpack多还是vite多可以在评论区讨论，有人说webpack灵活yyds，有人说vite开箱即用，配置不用那么复杂yyds，我说：除非你能决定在公司用什么。不然公司用什么你就要用什么，你说（我不管，我就要用XXX，项目和我有一个能跑就行），开个玩笑。

先说webpack

小伙伴们平时写vue2时用的vue-cli就是基于webpack封装的脚手架

1.webpack的配置项，是在webpack.config.js文件中。

2.webpack是配置项，是通过node的module.export向外进行暴露

3.开发时，需要将代码编译成js，若项目较大，npm run dev时，需要一个coffee time（懂的都懂），新版webpack有缓存，可以提升速度，有兴趣可以自行研究。

4.热更新，是基于socket，代码有变化，会向浏览器端进行推送来实现。

5.babel，用于打包时代码进行转换（这里注意，一般用于代码转换的配置都放在loader中），将新特性代码进行降级，以适配低版本浏览器。具体配置请直接查阅文档，注意一点，设置兼容列表是在package.json中对browserslist进行修改，具体配置请参考github。

再说vite

如果你用vue3进行开发，vite或许更值得推荐

1.vite的配置项，是在vite.config.js

2.vite的配置项，是通过es6的模块化向外进行暴露，export default {}，细心的伙计可能会问，不是还有个defineConfig吗，嗯，它是负责代码提示的，具体怎么使用不展开细说，有兴趣可以直接看文档。

3.开发时，并不对代码进行打包，采用ESM的方式运行项目，所以效率能提升。打包时采用rollup进行打包。

4.热更新，代码有变化，客户端会向开发服务器发送请求来实现。

5.vite对于代码的兼容性处理是通过插件的形式，legacy，设置兼容列表是在legacy方法中传参。具体配置同样参考文档。

---

ok，以上我所列出的几点仅供各位参考，当然很多还有很多区别，希望各位对你的项目有一个整体的认知，不要把眼光只停留在业务上，借用小满zs的一句话，格局打开。你只有清楚了不同的构建工具的区别与相同点，才能在选型或者配置上做到游刃有余。

我平时其实也参加过很多面试，也换过很多工作。个人比较爱折腾吧，稳定是一个褒义词呢还是一个贬义词呢，我不喜欢做重复性的事情，如果每天都在重复同样的事情，那么即使7年和7天又有什么分别呢。当然大环境不好，产品少，项目少，那么摆烂躺平能解决问题吗，并不。

都说面试造火箭，工作拧螺丝，是但并不完全是，面试能暴露出你的不足，所以遇到不会的问题，我也会回头再查缺补漏。而并不是遇到问题就跳过，遇到问题就跳过。

无论各位小伙伴遭遇裁员也好，焦虑也罢，也许很多人都会选择考公，有人上岸有人不会，如果你有信心还能在这个行业摸爬滚打下去，就多提升自己，虽然你会说，裁不裁你和你技术没多大关系，和你努不努力没多大关系，业务不赚钱，就会把整个部门砍掉，ok，你是应该关心这些吗，并不，要做的是尽可能提升自己，有一天，即使你找不到工作，你依然可以通过你的技能赚钱，你甚至可以创造岗位。

要清楚的是，提升自己并不是为了一份更好的工作，而是为了有更多的选择。可以带来更多的价值，而不是更多的二氧化碳。