RN 项目 使用 ES Lint
1，在开始之前，首先看下官网及资料
官网：
https://eslint.org/
官方 Getting Started
[https://eslint.org/docs/user-guide/getting-started](https://eslint.org/docs/user- guide/getting-started)
官方规则说明
https://eslint.org/docs/rules/
配置rule 说明
https://blog.csdn.net/Cy_Shay/article/details/78217381
2，开始我们的工作，安装Eslint
有两种安装方式,全局安装或本地项目安装.(推荐 本地项目安装) 本地项目安装命令:
npm install eslint --save-dev
3，初始化ES lint , 即执行下面指令
npx eslint --init
然后根据提示符一步步操作，推荐 airbnb 风格的设置。
开始检查，npx 是指运行node_modules下面的指令，我这里指定检查 ./src/app.js 这个文件
npx eslint ./src/app.js
如果遇到一些 字符错误等。可以使用自动修复一些空格缩进等警告。
npx eslint ./src/app.js -- fix
4，更多配置
ES Lint 通过配置文件设定规则，我们新建一个 .eslintrc.js，修改如下：
文件： .eslintrc.js
module.exports = {
"extends": "airbnb",
"rules": {
"import/no-named-as-default": 0,
"import/no-named-as-default-member":0
}
};
还有些规则要设定，比如箭头表达式等的支持。
a) 添加 插件 babel-eslint ，它能让 ES Lint 识别ES6语法
yarn add babel-eslint --dev
b) 修改 .eslintrc.js
"parser": "babel-eslint",
查看报告。有时候我们需要查看html文本输出报告，使用下面的指令。
./src -o xxxx.eslint.report.html -f html
5， 扩展
忽略不检查某些文件
a) 创建文件
.eslintignore
b) 示例，在 .eslintignore 文件中添加一个
**/node_modules/**
或者 某个文件关闭eslint检查，在文件头部添加声明
/* eslint-disable */
某一行js代码关闭eslint检查
// eslint-disable-next-line
alert('e')
增加配置：eslint-plugin-react
a) 执行指令
yarn add eslint-plugin-react --dev
b) 配置修改 .eslintrc.js
添加插件 "react" to the plugins section.
{
"plugins": [
"react"
]
}
启用 JSX 支持 （ With ESLint 2+ ）
{
"parserOptions": {
"ecmaFeatures": {
"jsx": true
}
}
}
启用规则
Enable the rules that you would like to use.
"rules": {
"react/jsx-uses-react": "error",
"react/jsx-uses-vars": "error",
}
Prettier插件，Prettier是代码格式化工具，能够统一个人或者团队的代码风格。
Es Lint 在 Jenkins 下的配置：
Setp 1.配置好 git 拉取源代码
Setp 2.配置好构建时运行shell
# 查看 node 版本
node -v
#安装 js module
yarn install
# 移除旧的
rm -rf ./build/eslint.report.*.html || true
# 准备报告的名称
cur_dateTime="`date +%Y%m%d%H%m`"
Setp 3.配置构建完后的 归档
归档： build/eslint.report.*.html
6， 参考：
https://eslint.org/
https://www.jianshu.com/p/1d66a10466d2
https://blog.csdn.net/Cy_Shay/article/details/78217381
关于ReactNative如何配置ESLint，Prettier，Pre-commit Hook
https://blog.csdn.net/Ctrl_S/article/details/82633261
这篇文章介绍rule很清晰
http://www.php.cn/js-tutorial-401669.html
网友评论