前言
Vite 是一个用于现代 JavaScript 应用程序的快速、轻量级的构建工具，其设计目的是易于使用和适用于大型项目。Vite-pretty-lint 是一个插件，可以在基于 Vite 的项目中安装和配置，以便在编写代码时能够自动对代码进行格式化和检查代码。这可以帮助开发人员在开发过程的早期捕获格式化和链接错误，并确保代码库遵循一致的样式。
学习目标：
- 如何为 vite 项目自动添加 eslint 和 prettier
- 它的原理是什么
资源：
- 源码地址：vite-pretty-lint
如何使用
创建一个vite项目：
npm init vite
进入项目文件夹下，安装 Vite-pretty-lint：
npm init Vite-pretty-lint
执行上面命令后，会提示选择项目类型和你使用的那种包管理器，如图： <img src="https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/9039a03050b04630bbfd7c1ce596e3a1~tplv-k3u1fbpfcp-watermark.image?" alt="" width="70%" />
施加魔法中，稍等片刻，它给你的项目自动添加上eslint与prettier的配置，懒人福音啊。
<img src="https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/68a1c56111224dcaa3832986665151d0~tplv-k3u1fbpfcp-watermark.image?" alt="" width="40%" />
它是如何做到的呢？
可以发现，执行 npm init Vite-pretty-lint 我们的项目主要发生了如下的变化：
- 自动生成了配置文件
- 添加了依赖
其实，实现上述功能所用到的方法这这篇文章 源码共读 - 构建脚手架（2K字长文） 中都有出现，为了加深印象，我们再来复习一遍。
入口文件
找到脚本的入口文件。如图：
<img src="https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/1e6858c15aa14a43a459e7a3d1d0b070~tplv-k3u1fbpfcp-watermark.image?" alt="" width="40%" />
询问项目类型
源码：
try {
const answers = await askForProjectType();
projectType = answers.projectType;
packageManager = answers.packageManager;
} catch (error) {
console.log(chalk.blue('\n
标签：body,const,共读,Vite,源码,eslint,return,type,vite
From： https://blog.51cto.com/codeniu/6178880