>[success] # eslint 常见的插件
### 扩展的配置
1. [eslint-config-airbnb](https://link.zhihu.com/?target=https%3A//github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb): 该包提供了所有的Airbnb的ESLint配置,作为一种扩展的共享配置,你是可以修改覆盖掉某些不需要的配置的,**该工具包包含了react的相关Eslint规则(eslint-plugin-react与eslint-plugin-jsx-a11y),所以安装此依赖包的时候还需要安装刚才提及的两个插件**
2. [eslint-config-airbnb-base](https://link.zhihu.com/?target=https%3A//github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb-base): 与上一个包的区别是,此依赖包不包含react的规则,一般用于服务端检查。
3. [eslint-config-jest-enzyme](https://link.zhihu.com/?target=https%3A//github.com/FormidableLabs/enzyme-matchers/tree/master/packages/eslint-config-jest-enzyme): jest和enzyme专用的校验规则,保证一些断言语法可以让Eslint识别而不会发出警告。
4. [eslint-config-prettier](https://link.zhihu.com/?target=https%3A//github.com/prettier/eslint-config-prettier): 将会禁用掉所有那些非必须或者和[prettier](https://link.zhihu.com/?target=https%3A//github.com/prettier/prettier)冲突的规则。这让您可以使用您最喜欢的shareable配置,而不让它的风格选择在使用Prettier时碍事。请注意该配置**只是**将规则**off**掉,所以它只有在和别的配置一起使用的时候才有意义。
### 插件
1. [eslint-plugin-babel](https://link.zhihu.com/?target=https%3A//github.com/babel/eslint-plugin-babel): 和babel-eslint一起用的一款插件.babel-eslint在将eslint应用于Babel方面做得很好,但是它不能更改内置规则来支持实验性特性。eslint-plugin-babel重新实现了有问题的规则,因此就不会误报一些错误信息
2. [eslint-plugin-import](https://link.zhihu.com/?target=https%3A//github.com/benmosher/eslint-plugin-import): 该插件想要支持对ES2015+ (ES6+) import/export语法的校验, 并防止一些文件路径拼错或者是导入名称错误的情况
3. [eslint-plugin-jsx-a11y](https://link.zhihu.com/?target=https%3A//github.com/evcohen/eslint-plugin-jsx-a11y): 该依赖包专注于检查JSX元素的可访问性。
4. [eslint-import-resolver-webpack](https://link.zhihu.com/?target=https%3A//github.com/benmosher/eslint-plugin-import%23resolvers): 可以借助webpack的配置来辅助eslint解析,最有用的就是alias,从而避免unresolved的错误
5. [eslint-import-resolver-typescript](https://link.zhihu.com/?target=https%3A//github.com/alexgorbatchev/eslint-import-resolver-typescript):和eslint-import-resolver-webpack类似,主要是为了解决alias的问题
6. [eslint-plugin-react](https://link.zhihu.com/?target=https%3A//github.com/yannickcr/eslint-plugin-react): React专用的校验规则插件.
7. [eslint-plugin-jest](https://link.zhihu.com/?target=https%3A//github.com/jest-community/eslint-plugin-jest): Jest专用的Eslint规则校验插件.
8. [eslint-plugin-prettier](https://link.zhihu.com/?target=https%3A//github.com/prettier/eslint-plugin-prettier): 该插件辅助Eslint可以平滑地与Prettier一起协作,并将Prettier的解析作为Eslint的一部分,在最后的输出可以给出修改意见。这样当Prettier格式化代码的时候,依然能够遵循我们的Eslint规则。如果你禁用掉了所有和代码格式化相关的Eslint规则的话,该插件可以更好得工作。所以你可以使用eslint-config-prettier禁用掉所有的格式化相关的规则(如果其他有效的Eslint规则与prettier在代码如何格式化的问题上不一致的时候,报错是在所难免的了)
9. [@typescript-eslint/eslint-plugin](https://link.zhihu.com/?target=https%3A//github.com/typescript-eslint/typescript-eslint/tree/master/packages/eslint-plugin):Typescript辅助Eslint的插件。
10. [eslint-plugin-promise](https://link.zhihu.com/?target=https%3A//blog.5udou.cn/douMi/editor/5cf5dfa5ce2785b40ef80bd6):promise规范写法检查插件,附带了一些校验规则。
辅助优化流程
11. [husky](https://link.zhihu.com/?target=https%3A//github.com/typicode/husky): git命令hook专用配置.
12. [lint-staged](https://link.zhihu.com/?target=https%3A//github.com/okonet/lint-staged): 可以定制在特定的git阶段执行特定的命令。
>[info] ## 文章来源
[最全的Eslint配置模板,从此统一团队的编程习惯
](https://zhuanlan.zhihu.com/p/87667635)
- 工程化 -- Node
- vscode -- 插件
- vscode -- 代码片段
- 前端学会调试
- 谷歌浏览器调试技巧
- 权限验证
- 包管理工具 -- npm
- 常见的 npm ci 指令
- npm -- npm install安装包
- npm -- package.json
- npm -- 查看包版本信息
- npm - package-lock.json
- npm -- node_modules 层级
- npm -- 依赖包规则
- npm -- install 安装流程
- npx
- npm -- 发布自己的包
- 包管理工具 -- pnpm
- 模拟数据 -- Mock
- 页面渲染
- 渲染分析
- core.js && babel
- core.js -- 到底是什么
- 编译器那些术语
- 词法解析 -- tokenize
- 语法解析 -- ast
- 遍历节点 -- traverser
- 转换阶段、生成阶段略
- babel
- babel -- 初步上手之了解
- babel -- 初步上手之各种配置(preset-env)
- babel -- 初步上手之各种配置@babel/helpers
- babel -- 初步上手之各种配置@babel/runtime
- babel -- 初步上手之各种配置@babel/plugin-transform-runtime
- babel -- 初步上手之各种配置(babel-polyfills )(未来)
- babel -- 初步上手之各种配置 polyfill-service
- babel -- 初步上手之各种配置(@babel/polyfill )(过去式)
- babel -- 总结
- 各种工具
- 前端 -- 工程化
- 了解 -- Yeoman
- 使用 -- Yeoman
- 了解 -- Plop
- node cli -- 开发自己的脚手架工具
- 自动化构建工具
- Gulp
- 模块化打包工具为什么出现
- 模块化打包工具(新) -- webpack
- 简单使用 -- webpack
- 了解配置 -- webpack.config.js
- webpack -- loader 浅解
- loader -- 配置css模块解析
- loader -- 图片和字体(4.x)
- loader -- 图片和字体(5.x)
- loader -- 图片优化loader
- loader -- 配置解析js/ts
- webpack -- plugins 浅解
- eslit
- plugins -- CleanWebpackPlugin(4.x)
- plugins -- CleanWebpackPlugin(5.x)
- plugin -- HtmlWebpackPlugin
- plugin -- DefinePlugin 注入全局成员
- webapck -- 模块解析配置
- webpack -- 文件指纹了解
- webpack -- 开发环境运行构建
- webpack -- 项目环境划分
- 模块化打包工具 -- webpack
- webpack -- 打包文件是个啥
- webpack -- 基础配置项用法
- webpack4.x系列学习
- webpack -- 常见loader加载器
- webpack -- 移动端px转rem处理
- 开发一个自己loader
- webpack -- plugin插件
- webpack -- 文件指纹
- webpack -- 压缩css和html构建
- webpack -- 清里构建包
- webpack -- 复制静态文件
- webpack -- 自定义插件
- wepack -- 关于静态资源内联
- webpack -- source map 对照包
- webpack -- 环境划分构建
- webpack -- 项目构建控制台输出
- webpack -- 项目分析
- webpack -- 编译提速优护体积
- 提速 -- 编译阶段
- webpack -- 项目优化
- webpack -- DefinePlugin 注入全局成员
- webpack -- 代码分割
- webpack -- 页面资源提取
- webpack -- import按需引入
- webpack -- 摇树
- webpack -- 多页面打包
- webpack -- eslint
- webpack -- srr打包后续看
- webpack -- 构建一个自己的配置后续看
- webpack -- 打包组件和基础库
- webpack -- 源码
- webpack -- 启动都做了什么
- webpack -- cli做了什么
- webpack - 5
- 模块化打包工具 -- Rollup
- 工程化搭建代码规范
- 规范化标准--Eslint
- eslint -- 扩展配置
- eslint -- 指令
- eslint -- vscode
- eslint -- 原理
- Prettier -- 格式化代码工具
- EditorConfig -- 编辑器编码风格
- 检查提交代码是否符合检查配置
- 整体流程总结
- 微前端
- single-spa
- 简单上手 -- single-spa
- 快速理解systemjs
- single-sap 不使用systemjs
- monorepo -- 工程
- Vue -- 响应式了解
- Vue2.x -- 源码分析
- 发布订阅和观察者模式
- 简单 -- 了解响应式模型(一)
- 简单 -- 了解响应式模型(二)
- 简单 --了解虚拟DOM(一)
- 简单 --了解虚拟DOM(二)
- 简单 --了解diff算法
- 简单 --了解nextick
- Snabbdom -- 理解虚拟dom和diff算法
- Snabbdom -- h函数
- Snabbdom - Vnode 函数
- Snabbdom -- init 函数
- Snabbdom -- patch 函数
- 手写 -- 虚拟dom渲染
- Vue -- minVue
- vue3.x -- 源码分析
- 分析 -- reactivity
- 好文
- grpc -- 浏览器使用gRPC
- grcp-web -- 案例
- 待续