潍坊自助建站模板免费友链平台
eslint写jsx报错
ChatGPT提示
在写JSX时，ESLint可能会报出一些语法错误，这些错误通常是由于ESLint默认配置中不支持JSX语法导致的。为了解决这些错误，我们需要在ESLint配置文件中启用对JSX语法的支持。
首先，需要安装eslint-plugin-react插件：
yarn add eslint-plugin-react --dev
然后，在.eslintrc文件中添加以下配置：
{"extends": ["plugin:prettier/recommended","eslint:recommended","plugin:@typescript-eslint/recommended"],"parserOptions": {"ecmaVersion": 6,"sourceType": "module","ecmaFeatures": {"jsx": true,"tsx": true}},"parser": "@typescript-eslint/parser","plugins": ["@typescript-eslint"],"env": {"browser": true},"globals": {"document": true},"ignorePatterns": ["src/vendor/*"],"rules": {"@typescript-eslint/no-explicit-any": "off","@typescript-eslint/no-non-null-assertion": "off"}
}在这个配置文件中，我们启用了ESLint对ES6和JSX语法的支持，同时继承了eslint:recommended和plugin:react/recommended配置，启用了react插件，并关闭了react/prop-types规则。如果你需要添加其他的规则或插件，可以在rules和plugins中添加相应的配置。
此外，如果你使用了其他的JSX语法扩展，比如React Router中的
{"rules": {"react/jsx-uses-vars": "off","react/jsx-uses-react": "off","react/jsx-no-undef": "off","react/jsx-uses-router": "off"}
}
这些规则可以在ESLint官方文档中找到。
在自己项目加上
我的代码
{"extends": ["plugin:prettier/recommended","eslint:recommended","plugin:@typescript-eslint/recommended"],"parserOptions": {"ecmaVersion": 6,"sourceType": "module","ecmaFeatures": {"jsx": true,"tsx": true}},"parser": "@typescript-eslint/parser","plugins": ["@typescript-eslint"],"env": {"browser": true},"globals": {"document": true},"ignorePatterns": ["src/vendor/*"],"rules": {"@typescript-eslint/no-explicit-any": "off","@typescript-eslint/no-non-null-assertion": "off"}
}