React Native ESLint配置

最新推荐文章于 2023-07-20 13:51:11 发布
最新推荐文章于 2023-07-20 13:51:11 发布
阅读量2.1k 收藏 2
点赞数
分类专栏： React
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zyh0709/article/details/90602207
版权
本文介绍了如何在React Native项目中配置和使用ESLint，包括其作用、安装步骤、规则设定、忽略检测的文件以及如何执行代码检查和修复。
摘要由CSDN通过智能技术生成

ESLint是一个JavaScript代码静态检查工具
官网

作用

  • check syntax 语法检查
  • find problems 发现问题
  • enforce code style 强制代码风格

安装

npm install eslint --save-dev
–save直接依赖 -dev指开发环境进行依赖
会自动写入到package.json的devDependencies节点

RN项目

可以手动在package.json中进行配置，然后执行npm install

"babel-eslint": "^10.0.1",
"eslint": "^5.14.1",
"eslint-config-airbnb": "^17.1.0",
"eslint-plugin-import": "^2.16.0",
"eslint-plugin-jsx-a11y": "^6.2.1",
"eslint-plugin-react": "^7.12.4",

使用/配置

规则设定

在根目录创建.eslintrc.js文件，其中rules节点调整规则

module.exports = {
  parser:'babel-eslint',
  env: {
    browser:
最低0.47元/天 解锁文章
zyh0709
关注
专栏目录
React Native之使用eslint
weixin_43887027的博客
09-10 482
Rect Native之使用eslint eslint规则请参考官网 添加依赖 yarn add eslint @react-native-community/eslint-config -D -OR npm i eslint @react-native-community/eslint-config -d 添加 .eslintrc.js配置文件 module.exports = { root: true, extends: '@react-native-community', // 以下是我
eslint-config-react-native:用于React Native项目的ESLint配置
03-20
@ breeffy / eslint-config-react-native 安装 yarn add --dev eslint prettier @breeffy/eslint-config-react-native 注意：我们正在使用yarn来安装deps。如果愿意，可以随意更改命令以使用npm 3+和npx 用法 添加到您的eslint配置中（ .eslintrc或package.json eslintConfig字段）： { " extends " : " @breeffy/eslint-config-react-native " }
React Native eslint配置
流星雨的博客
07-15 1518
eslint提供了一个插件化的javascript代码检测工具，本文依托于React Native讲解eslint的使用。
ReactNative配置git hooks进行eslint检查
戴戴的博客
11-05 797
为了让我们commit代码时，可以避免提交一些测试性的例如alert、if判断写死等调试性代码，同时增强项目代码的健壮性和可维护性，特引入git hooks配置使得没有通过eslint的规则校验的暂存区文件无法commit的到本地仓库 引入过程 引入依赖包 yarn add -D eslint@7.32.0 @react-native-community/eslint-config lint-staged typescript 为什么eslint使用7.32.0，而不使用最新的8.x版本 因为e
react native开发中eslint配置和初始化
博客
09-17 5968
先简单介绍一下mac系统环境下，eslint的配置。
关于ReactNative如何配置ESLint，Prettier，Pre-commit Hook
Ctrl_S的博客
09-11 2418
ESLint ESLint 是一个按照规则给出报告的代码检测工具，使用它可以避免低级错误和统一代码风格，这对公司团队开发非常实用。 安装 1.全局安装 如果你想使用ESLint适用于你所有的项目，建议全局安装ESLint npm i -g eslint 初始化配置文件 ./node_modules/.bin/eslint --init 2.局部安装 单个项目使用 npm i...
eslint-config-react-native-typescript:Type用于TypeScript React Native项目的ESLint配置
05-23
使用TypeScript编写的React Native项目的ESLint配置。 :star: 特征 基于但具有扩展的规则集。 格式为 。 使用检查循环导入/导出。 使用强制执行一致的导入顺序。 使用确保可访问的应用程序。 :nut_and_bolt: ...
eslint-config-react-native-wcandillon:我对React Native的eslint配置
04-27
我的React Native的ESLint和TypeScript配置。 用法 # you also need eslint if not installed already: yarn add eslint --dev yarn add eslint-config-react-native-wcandillon --dev 在.eslintrc ： { " ...
eslint-plugin-react-native：用于ESLint的React Native插件
02-03
用于React Native的ESLint插件 对ESLintReact本机特定的掉毛规则。 该存储库的结构类似于（并包含来自）出色的。 安装 在本地或全局安装 。 $ npm install --save-dev eslint 为了充分利用此插件，建议除之外还...
eslint的配置
wangrong111222的博客
07-17 788
"eslintConfig": { "extends": "react-app", "rules":{ "eqeqeq":["off"], "jsx-a11y/accessible-emoji":["off"], "no-useless-constructor":["off"]
记录一些React native的配置问题
weixin_52143507的博客
04-26 221
react-native的一些配置问题 用react-native-screens一直报错： Task :react-native-screens:compileDebugJavaWithJavac FAILED RN的版本是0.61.5，需要降级react-native-screens到2.6.0版本才能用。 另外用VSCode时，新的RN项目会报一系列的Format错误，一堆波浪线看的很闹心，编辑eslintrc.js： module.exports = { root: true, .
RN配置eslint规则
戴戴的博客
11-09 1062
在ReactNative配置git hooks进行eslint检查一文中有详细介绍ReactNative项目怎么添加git hooks，使得在git commit之前对代码进行eslint检查，本文记录一下对应的eslint规则。 eslint实用规则 规则继承自@react-native-community，在此基础上进行一些自定义的rules配置，具体含义可以在eslint官网查看具体说明是示例 module.exports = { root: true, extends: ['@react-n
RN项目中使用ESLint
mscinsidious的博客
05-11 1410
ESLint 是用来检查我们写的 JavaScript 代码是否满足指定规则的静态代码检查工具。通过用 ESLint 来检查一些规则，我们可以：统一代码风格规则，如：代码缩进用几个空格；是否用驼峰命名法来命名变量和函数名等。减少错误，如：相等比较必须用 === ，变量在使用前必须被声明，在条件语句中不能使用赋值语句等。提高代码质量，如：函数最多有多少条件分支；最多有几个参数，代码块最多能嵌套多少层...
React项目关闭Eslint的办法（亲测本人用过的最简单的）
qq_42443707的博客
07-20 2791
eject确实有效，但是我不想把配置信息暴露出来；用了rewired但是貌似是我配置的时候没写对，也没有生效；在看package.json的时候，试着改了改，结果居然有效。
react 关闭eslint 配置
weixin_30755393的博客
01-30 2778
在 package.json 中修改为一下"eslintConfig": { "extends": "react-app", "rules": { "no-undef": "off", "no-restricted-globals": "off", "no-unused-vars": "off" } } 　...
ESLint配置解析
shengjon的博客
11-25 3917
eslint 本身是一个语法规范检查的包。
邂逅ReactNative(二)：使用Eslint规范项目代码
Cy_Shay的博客
10-12 3217
一、EsLint简介 ESLint是由Nicholas C. Zakas编写的一个可扩展、每条规则独立、不内置编码风格、可自定义规则为理念的Lint工具。 在团队协作中，为避免低级错误的产生和统一代码的风格，会预先制定编码规范。使用 Lint 工具和代码风格检测工具，则可以辅助编码规范执行，有效控制代码质量。EsLint帮助我们检查Javascript编程时的语法错误。比
react-native如何配置eslint+prettierrc
weixin_43947842的博客
09-16 505
Eslint + Prettier package.json "devDependencies": { "@babel/core": "^7.15.0", "@babel/eslint-parser": "^7.15.0", "@babel/runtime": "^7.8.4", "babel-jest": "^25.1.0", "eslint": "^7.32.0", "eslint-config-pretti
react native 调了不存在的函数 Eslint怎么检查出这种语法错误
最新发布
09-07
在 React Native 开发中，如果你想通过 ESLint 验证代码中是否存在试图调用不存在函数的情况，你需要安装并配置相应的规则插件。Eslint 提供了一个名为 "no-undef" 的内置规则，用于检测未声明的变量。对于函数，你可以使用 "react-hooks/exhaustive-deps" 和 "react/jsx-no-bind" 插件来辅助检查。 1. 首先，确保你已经安装了 ESLint 和最新版本的 React Native CLI。如果还没有安装，可以使用以下命令： ``` npm install -g eslint npm install --save-dev eslint-plugin-react-hooks eslint-plugin-react ``` 2. 更新 `.eslintrc.js` 文件以启用相关的插件： ```json { "plugins": ["react", "react-hooks"], "rules": { "react-hooks/exhaustive-deps": "warn", // 发警告，可以改为error强制执行 "react/jsx-no-bind": "warn", // 避免使用 this.bind()，可能导致未定义函数调用 "no-undef": "error" // 检查未定义的变量和函数 }, // 其他配置... } ``` 3. 运行 ESLint 进行检查： ``` npx eslint your_project_directory ``` 这将扫描整个项目，找出试图调用未定义函数的地方，并给出警告或错误。如果遇到 `no-undef` 规则的错误，那很可能是你尝试调用了不存在的函数。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值