umi源码探索：lint分析篇

这一篇文章主要读 umi 里的@umijs/lint的代码。这个包是通过umi lint集成式调用 ESLint 和 Stylelint，用于检查及修正代码是否符合规则。

前言

这一篇文章主要读 umi 里的@umijs/lint的代码。这个包是通过umi lint集成式调用 ESLint 和 Stylelint，用于检查及修正代码是否符合规则。支持只校验 js、ts、tsx、jsx 类型文件、支持只校验 css、less 等样式文件、支持校验 cssinjs 模式校验、修正代码。

api 介绍

umi lint 命令的用法如下：

1	$ umi lint [glob] [--fix] [--eslint-only] [--stylelint-only] [--cssinjs]

参数说明：

[glob]: 可选，指定要 lint 的文件，默认为 `{src,test}/**/*.{js,jsx,ts,tsx,css,less}`
--quiet: 可选，禁用 `warn` 规则的报告，仅输出 `error`
--fix: 可选，自动修复 lint 错误
--eslint-only: 可选，仅执行 ESLint
--stylelint-only: 可选，仅执行 Stylelint
--cssinjs: 可选，为 Stylelint 启用 CSS-in-JS 支持

源码阅读

这个包的在 umi/packages/lint 目录下。

整个仓库可以分为两个部分：配置部分、命令执行部分。

配置部分

这部分的目录在 umi/packages/lint/src/config 里，里面是放 eslint 和 stylelint 的默认配置。

命令执行部分

这个部分主要涉及 umi/packages/lint/src/linter 目录和 umi/packages/lint/src/index.ts 文件，@umijs/lint实现的核心。

index 文件主要负责对用户输入参数的判断，通过调用 linter 类的 run 函数来分发执行 eslint 或者 stylelint，默认都执行。

linter 目录中有一个基础类和两个派生类，基础类会拿到 eslint 或者 stylelint 的 bin 目录，通过 fork 的方式来代理执行 eslint 或者 stylelint 的命令。派生类主要负责默认参数处理。

总结

整个包代码量很少，通过 fork 的形式来代理命令执行思路很好，但是这个包有个问题，就是用户使用这个包需要自己安装 eslint 和 stylelint。作为一个资源整合类包在用户使用的时候不应该感知到你整合的资源包，完全可以内置 eslint 和 stylelint。