vitejs vs webpack? 2022 年了,选哪个?

2022-10-10 06:51:42 +08:00
 ericgui

我用 react

感觉 vite 虽然快,但生态还是差点意思,比如,没有官方的 eslint 插件,甚至没有一个被广泛接受的一个社区插件。官方给的理由是, [ eslint is an optional tool for development and not all projects are using them. This feature could be served as a plugin instead of the core. Thanks.] 这不废话嘛,你当然可以不用,但稍微上点规模的项目,哪个不用 eslint ?

https://github.com/vitejs/vite/issues/818

我其实特别想试试 vite ,但奈何这生态不给力,官方也找理由推脱

除了 eslint ,还有什么其他坑?

4797 次点击
所在节点    程序员
28 条回复
ccyu220
2022-10-10 07:59:52 +08:00
vite 配置 eslint 直接用以前 create-app 下面那一套不就好了,不然就 npx eslint --init ,这应该没有什么问题吧。
ccyu220
2022-10-10 08:02:00 +08:00
并且 vite-plugin-eslint 这个不就是 eslint 插件吗...
hb751968840
2022-10-10 08:26:57 +08:00
上规模的不应该是 pre-commit 时 lint 吗,用 husky ,跟 vite ,webpack 没关联。
fpure
2022-10-10 08:52:30 +08:00
写 ts 的时候用了一下 vite ,浏览器原生的模块化的思想确实好用
makelove
2022-10-10 08:52:43 +08:00
vite 不是打包工具吗,怎么扯上 eslint 了
itfanr
2022-10-10 08:56:55 +08:00
@makelove 同问
tomieric
2022-10-10 09:31:08 +08:00
因为推荐的是 TS 写代码
ryougifujino
2022-10-10 09:44:46 +08:00
@tomieric #7 TS 写代码也是要上 ESLint 的
dtdths1
2022-10-10 09:59:08 +08:00
杰哥:我看你是完全不懂哦~
agdhole
2022-10-10 10:05:06 +08:00
vite 用 eslint 完全没问题啊
duan602728596
2022-10-10 10:27:38 +08:00
eslint 交给 IDE 就好了,然后在提交时检查一遍。没有必要在开发时配置。
每次修改文件后都要检查一遍,不觉得编译慢吗?
wenerme
2022-10-10 10:43:02 +08:00
选 NextJS 或 Vite 或 ESBuild 或 Rollup 或 SWC
Webpack 是不可能了

- NextJS - 开箱即用,支持 SSR ,支持 API ,支持 Layout SSR ,支持 SIG
- 缺点: 只是应用开发
- Vite = ESBuild + Rollup + DevServer
- ESBuild - 快准狠,watch 开发环境友好,可以开发 node 项目
- 缺点 有一些 -> https://wener.me/notes/web/dev/bundle/esbuild
- Rollup - 支持更丰富的 包 - 例如 systemjs ,支持使用 ESBuild 作为插件
- 缺点 rollup 3 还没正式发布 https://wener.me/notes/web/dev/bundle/rollup
- SWC - 快,但还不完善 - SWC vs ESBuild -> https://wener.me/notes/web/dev/bundle/swc

> 选择工具的时候优先看不能做什么,边界在哪里

无脑选择 NextJS ,更细的则自己构建整个逻辑,例如 自定义 rollup 然后复用逻辑到多个项目

- https://github.com/wenerme/wode/blob/main/packages/wode/rollup.mjs
- 配置被 https://github.com/wenerme/wode/blob/main/packages/torrent/rollup.bundle.mjs 这里使用

除了 web 开发,测试也需要 transpile ,建议 esbuild - 最快,配合 ava 很方便 https://github.com/wenerme/wode/blob/8a4c16cbd71cbc3c5d25142997b97700d6521eff/packages/torrent/package.json#L77-L86
zhwithsweet
2022-10-10 10:56:56 +08:00
你根据我这个改改就行: https://github.com/fisand/vite-wagmi-seed

- 写好了 eslint 已经常用的规则
- 支持辅助型的 ts-checker ;(因为 esbuild 不会校验类型
- 内置原子类 css / file style router / jotai / antd
- 无黑盒逻辑,可以把 web3 相关的删了开发普通应用
dcsuibian
2022-10-10 11:32:24 +08:00
如果是 vue3 的话,我就用 vite 了
如果是 React 的话,我就用 Next.js ,Next.js 下面用啥我用啥
liuzhaowei55
2022-10-10 11:55:50 +08:00
我选 webpack ,vite 偶尔会遇到一些莫名其妙的问题,自己的项目尝试更换过,劝退
knives
2022-10-10 12:29:04 +08:00
我选 webpack + swc 。swc 的插件个人感觉还是略复杂,不如 webpack 的开箱即用。合起来用慢就慢点吧……
yikyo
2022-10-10 12:34:05 +08:00
强迫症比我严重,eslint 在 commit 时检查就好了,husky
cwliang
2022-10-10 12:38:10 +08:00
无脑 webpack 生态齐全,遇到问题好解决。vite 使用量太少了,遇到问题可能 stackoverlow 上不一定能找到。
对我来说成熟方案少折腾就足够了
还有尤大 diss react 团队不提供 vite 的集成模版,就很无语,你若盛开蝴蝶自来
ericgui
2022-10-10 12:54:15 +08:00
@cwliang Evan 一直都有 attitude 的问题。
ryougifujino
2022-10-10 13:54:13 +08:00
其实 webpack5 还是不错的,dev 和 prod 都有 cache 可以配,配合 thread-loader 可以进一步提速。等以后的 lazyCompilation 变成正式功能以后 devServer 的启动速度可以进一步提高(现在是 experiments )。而且作者在 Next.js ,所以他们肯定选 webpack 。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/885661

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX