[英]Why my ESLint configuration file do not work with React Native?
使用 VSCode,我使用 expo-cli 创建了一个 React Native 应用程序。 我想使用 ESLint 和 Prettier 来提高我的代码质量。
我希望 ESLint 在我的“问题”选项卡中打印出错误,例如,如果我有这一行var asd = 1;
在 App.js 中,ESLint 会打印出Unexpected var, use let or const instead.
我有 ESLint 配置文件设置,我故意编码错误以测试 ESLint 是否正常工作,但我没有看到任何错误。
VSCode 的 ESLint 已经安装了 1.9.1 版本,链接中包含我的项目结构。
这是我的 App.js 代码,有 2 个地方我预计会产生错误:
import React from "react";
import { StyleSheet, Text, View } from "react-native";
export default function App() {
return (
<View style={styles.container}>
<Text>Open up App.js to start working on your app!</Text>
</View>
);
}
var asd = 1; // this should show error
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center"
}
});
const zzz = StyleSheet.create({
// this should show error based on react-native/no-unused-styles rule in eslint config
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center"
}
});
这是 my.eslintrc.json 文件:
{
"extends": [
"airbnb",
"prettier",
"plugin:node/recommended",
"plugin:react/recommended"
],
"plugins": ["prettier", "react", "react-native"],
"env": {
"es6": true,
"browser": true,
"node": true,
"react-native/react-native": true
},
"parserOptions": {
"ecmaFeatures": {
"jsx": true
}
},
"rules": {
"prettier/prettier": "warn",
"no-unused-vars": "warn",
"no-console": "off",
"func-names": "off",
"no-process-exit": "off",
"no-alert": "warn",
"object-shorthand": "off",
"class-methods-use-this": "off",
"no-plusplus": ["error", { "allowForLoopAfterthoughts": true }],
"react-native/no-unused-styles": "error"
},
"settings": {
"import/resolver": {
"node": {
"extensions": [".js", ".ios.js", ".android.js"]
}
}
}
}
我在配置文件中的parserOptions
不够详细。 我需要像下面这样更新它:
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.