一、react
为何要有规范化标准webpack
软件开发须要多人协同git
不一样开发有不一样习惯和喜爱es6
不一样喜爱增长项目维护成本web
因此须要统一标准typescript
哪里须要npm
代码、文档、日志curl
人为编写的都须要工具
代码标准化规范编码
实施规范化的方法
编码前人为的标准约定
经过工具实现Lint
二、ESLint介绍
最为主流的js lint检测工具
很容易统一开发者的编码风格
能够帮助提高编码能力
三、EsLint安装
npm install eslint --save-dev
四、快速上手
检查步骤
编写问题代码
使用eslint执行
以前完成eslint配置
npm eslint init
npm eslint 对应地址
module.exports = { env: { browser: true, es2020: true }, extends: [ 'standard' ], parserOptions: { ecmaVersion: 11 }, rules: { } }
eslint配置文件
module.exports = { env: { browser: false, es6: false }, extends: [ 'standard' ], parserOptions: { ecmaVersion: 2015 //检测语法,可是不检测变量是否可用,配置须要env来配置 }, rules: { 'no-alert': "error" }, globals: { "jQuery": "readonly" } }
eslint配置注释
const str1 = "${name} is a coder" // eslint-disable-line no-template-curly-in-string
结合自动化工具
与项目统一,管理更加方便
eslint结合webpack后续配置
extends: [ ‘standard’, ‘plugin:react/recommended’ ], 检查typescript parser: '@typescript-eslint/parser’,//配置语法解析器 parserOptions: { ecmaVersion: 11 }, plugins: [ '@typescript-eslint' ],
eslint结合git hooks
pre-commit文件进行修改
husky能够实现git hooks的使用需求
'husky':{ hook:{ precommit:'npm run test' } }