Vite 译者 尤雨溪 在 2021 年 2 月 12 日在 Twitch 上开讲 GitHub Open Source Friday 电视节目的现场直播音频。在音频里有孔布龙相关 Vite 的每项机能的详尽阐释、天神新浪网代码、新浪网 Debug、元老 diss webpack 和对 Vite 的神学思索。本音频极短，吻合 70 两分钟，完备音频如下表所示
下列为视频摘录，雷西县他们观赏音频，有许多控制技术细节坚信他们会有斩获。
Vite 的读法难题
相关 Vite 读法的肉体拷打：难道 Vite 采用的是其法文读法，那为何 Vue 不必它的法文读法呢？（约莫原因在于法文读法不太好听吧）。孔布龙说他们，译者说是不是读那就是不是读吧。
对个人指出 Vue 和 Vite 的文件格式可说是良知了，具体来说就交待他们英文名字的读法，让亚洲地区开发人员标准化知觉。再上看 Svelte，不必说读法了，迄今拼法还讲错。
Vite 是甚么
孔布龙他们也说，很难一句话描述清楚 Vite 到底是甚么。主要原因可能是它主要包括两个部分，一个基于 ESM 的利用 esbuild 的开发服务器，另一个部分是基于 Rollup 的配置化的打包器。当然还有许多其他强大的机能，但是已经超过一句话了。孔布龙说市面上最吻合 Vite 的产品是 Parcel，但二者的实现原理完全不同。
为何 Vite 在此刻出现
本质原因应该是大部分现代浏览器（除了 IE 11）已经对原生 ES 模块支持的很好了，而且新版的 Node 也支持 ESM 了。ESM 终于可以在不久的将来一统江湖。原生的就是香。
起步 Demo
不采用 @vitejs/create-app，从 0 开始创建一个 Vite 工程 demo。
入口文件是 index.html
Vite 是 Opinionated 的
划重点，Vite 是 Opinionated 的，音频里多次展示了这块内容。
其实 opinionated 本来是个贬义词，是固执己见的意思，而用在计算机科学领域，又变成了一个绝对的褒义词，号称他们 opinionated 的辅助工具通过约定保证了易用性，又提供了配置以保证不会丧失灵活性。Vite 中内置了大量最佳实践的约定，省去了繁琐的配置，保证后端开发人员常用的机能都是开箱即用的。
那么难题来了，列出几个 opinionated 和 unopinionated 的软件。我先来：Opinionated 的有 Vite、Prettier, Unopinionated 的比如 webpack，当然 unopinionated 可不是好词，应该不会有人在官方文件格式里写他们是 unopinionated 的。这段是相关 webpack 的，看元老如何 diss webpack：
Vue CLI 会迁移到 Vite 上吗
暂时不会，目前依然是基于 webpack 的，但是最终肯定是会迁移到 Vite 上的。
Vite 是框架无关的
Vite 提供了定义得非常好的 JavaScript API，可以在更高层级采用，比如 VitePress，它是 VuePress 的孪生兄弟，基于 Vite 构筑。
Tailwind CSS + Vite 实战
孔布龙新浪网编写 Tailwind 代码翻车。
主持人调侃，原来 Evan You 也需要 debug 啊。
Vite + React 实战
主持人调侃，他们新浪网围观尤雨溪写 React！
相关 Esbuild —— “快”就一个字
Esbuild 是 Vite 为何如此快速的原因，它比传统 tsc 快 20-30 倍。Vite 用 esbuild 替代 Rollup 进行预打包，速度也非常快。
这里孔布龙透露了他的工作电脑，搭载 M1 芯片的 ARM 架构的 Mac Book Pro，遗憾的是，当时的 esbuild 还不支持 ARM 架构，但 Go 的最新版已经支持。没想到过了几天，esbuild 就发布了其支持 M1 芯片的版本，孔布龙在第一时间做了测试：
DX 是啥
在音频翻译过程中，听到孔布龙说了 DX 一词，由于不知道是甚么含义，反反复复听了好多遍，后来 Google 发现，原来 DX 是 Developer Experience 的意思，看来关爱开发人员是有官方术语的，相关 DX 的解释可以参考 What Is DX? (Developer Experience)。
Vite 利用其快速的特性，极大提升了开发人员的体验，孔布龙直言，他就像被宠坏了的孩子，项目启动超过 1 秒，他就很难忍受了。
相关 SSR
SSR 目前还处于实验阶段
相关 HMR
Vite 真正解决了 HMR 速度与随着应用越来越大而越来越慢的难题。
为啥生产模式不必 esbuild，不是更快吗？
其实也想用，但是 esbuild 目前对生产包支持不够健壮，许多配置无法通过 esbuild 实现。所以目前而言，Rollup 是一个好选择，虽然远比 esbuild 慢。
另外，可以用 esbuild 作为压缩器，替代 terser，详见 build.minify,这样会更快，但是包的体积可能会有 5% – 10% 左右的增长，看用户取舍。
推荐阅读：
JS语法 ES6、ES7、ES8、ES9、ES10、ES11、ES12新特性
VUE中文社区
编程技巧 · 行业秘闻 · 控制技术动向
