最近在整理个人博客，之前的博客是基于 Hexo 3.x 版本的，一晃两年多过去了，Hexo 已经升级到了 5.x 版本，新版本带来了一系列新特性，并且性能得到了极大的提升。而个人喜欢的 Icarus 主题也有了大版本的更新，更是带来了赛博朋克的主题，十分惊艳，话不多说，直接看效果。

现在让我们从零开始，快速搭建一个赛博朋克风格个人博客。

• 原视频地址：Next generation frontend tooling with ViteJS ✨ Open Source Friday ✨
• 中英文字幕视频地址（B站）：【译】下一代前端工具 ViteJS 中英双语字幕 - Open Source Friday
• 中英文字幕视频地址（腾讯视频）：【译】下一代前端工具 ViteJS 中英双语字幕 - Open Source Friday
• 英文字幕：听译、YouTube 自动字幕
• 英文校对、翻译：Ivocin
• 视频字幕地址： Vite-Open-Source-Friday
• 原文链接：【译】下一代前端工具 ViteJS 中英双语字幕 - 掘金

关于 Vite，来看看作者本人怎么说。本视频是 Vue 以及 Vite 作者 尤雨溪 在 2021 年 2 月 12 日在 Twitch 上做客 GitHub Open Source Friday 节目的直播视频。在视频里有尤大关于 Vite 的各项功能的详细阐述、大神在线编码、在线 Debug、大佬 diss webpack 以及对 Vite 的哲学思考。本视频很长，接近 70 分钟，下面是视频摘录，大家可以选择自己感兴趣的点自行传送。强烈建议大家观看视频，里面有很多细节相信大家会有收获。

前言

Vite 无疑是当前最火热的项目之一，随着春节后 2.0 版本的发布，越来越多开发者开始关注起了这个项目。这个号称下一代前端构建工具的给我们最大的印象的就是快。日常被缓慢的项目启动时间和 HMR 折磨，有了 Vite 之后，真的不要太爽。虽然 Vite 和框架无关，但应用较多的仍然是 Vue 工程，那么 React 工程是否能够顺利使用呢，这两周在工作之余，就开始了 Vite 2.0 + React 的尝试。当然其中踩了比较多的坑，比如 Antd 的引入带来的一系列问题，别名怎么写，代理如何配置，集成 ahooks 等等，希望能够帮助到使用 React 又想使用 Vite 提升开发效率的同学，少走弯路。当然，我们还可以从实践的过程中直观了解到 Vite 的预打包原理以及性能真实的感受。

本文源码地址在 vite-playgrounds 中，如果阅读中发现问题，欢迎 pr。

本文是在 React 工程的 VS Code 插件及配置 基础上编写的，当时写的时候是 2018 年，至今项目组使用 React 开发已经两年多了，是时候更新一波 Visual Studio Code 插件使用文档了。本文主要以实用为目的，本着不折腾的原则，只挑选平时开发 React 工程用的顺手的插件、主题和字体，也欢迎同学们推荐好用的效率神器。

最近使用 VS Code 来开发 React，本文记录一些使用的 VS Code 插件以及离线安装插件的方法。