【源码共读】Vite 项目自动添加 eslint 和 prettier

vite-pretty-lint库是一个为Vite创建的Vue或React项目初始化eslint和prettier的库。

该库的目的是为了让开发者在创建项目时，不需要手动配置eslint和prettier，而是通过vite-pretty-lint库来自动配置。

源码地址：

• vite-pretty-lint
• github1s 直接看

使用

根据vite-pretty-lint库的README.md，使用该库的只需要执行一行命令即可：

// NPM
npm init vite-pretty-lint

// YARN
yarn create vite-pretty-lint

// PNPM
pnpm init vite-pretty-lint 

这里就涉及到了一个知识点，npm init <initializer>，yarn create <initializer>，pnpm init <initializer>，这三个命令的作用是一样的，都是用来初始化一个项目的。

<initializer>是一个初始化项目的包名，比如vite-pretty-lint就是一个初始化项目的包名;

执行npm init vite-pretty-lint命令后，相当于执行npx create-vite-pretty-lint命令；

这里不多讲解，参考：npm init

源码阅读

打开lib/main.js文件直接看，一开头就看到了下面这段代码：

const projectDirectory = process.cwd();

const eslintFile = path.join(projectDirectory, '.eslintrc.json');
const prettierFile = path.join(projectDirectory, '.prettierrc.json');
const eslintIgnoreFile = path.join(projectDirectory, '.eslintignore'); 

一看这些名字就知道，这里是用来创建eslint和prettier的配置文件的，这里的projectDire