Vite项目自动添加eslint prettier源码解读
田八 人气:0引言
vite-pretty-lint
库是一个为Vite
创建的Vue
或React
项目初始化eslint
和prettier
的库。
该库的目的是为了让开发者在创建项目时,不需要手动配置eslint
和prettier
,而是通过vite-pretty-lint
库来自动配置。
源码地址:
使用
根据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
的配置文件的,这里的projectDirectory
就是当前项目的根目录。
当然现在这些暂时还没有用到,接着往下走:
async function run() { let projectType, packageManager; try { const answers = await askForProjectType(); projectType = answers.projectType; packageManager = answers.packageManager; } catch (error) { console.log(chalk.blue('\n
加载全部内容
- 猜你喜欢
- 用户评论