Javascript Eslinter未检测到为react组件定义的道具类型
在中,使用以下代码创建了一个javascript文件:Javascript Eslinter未检测到为react组件定义的道具类型,javascript,reactjs,webpack,eslint,react-proptypes,Javascript,Reactjs,Webpack,Eslint,React Proptypes,在中,使用以下代码创建了一个javascript文件: import React, {Component, Fragment} from "react" import PropTypes from "prop-types" export default class DefaultBootstrap extends Component { render() { return (<div>Hi</div>) } } DefaultBootstrap.propType
import React, {Component, Fragment} from "react"
import PropTypes from "prop-types"
export default class DefaultBootstrap extends Component {
render() { return (<div>Hi</div>) }
}
DefaultBootstrap.propTypes = {
name: PropTypes.bool.isRequired
}
所以我的问题是,为什么即使我已经在上面定义了道具类型规则,它也会向我显示上述警告
我使用Webpack、Babel、React和Eslinter来设置我的应用程序
.eslintrc.json
{
"parser": "babel-eslint",
"plugins": ["react"],
"rules": {
"prop-types": ["warn"],
}
}
在查看代码之前,ESLint首先要查找
prop-types
规则的实现。错误消息表示找不到该规则。由于prop-types
规则是由插件eslint-plugin-react
提供的,并且不是内置规则之一,因此您需要在.eslintrc.json
中使用插件名称和斜杠作为其名称的前缀:react/prop-types
。这告诉ESLint它应该在ESLint插件react
中查找prop type
规则
{
"parser": "babel-eslint",
"plugins": ["react"],
"rules": {
"react/prop-types": ["warn"],
}
}
你可以在网上阅读更多
{
"devDependencies": {
"@babel/core": "7.1.2",
"babel-eslint": "10.0.1",
"babel-loader": "8.0.4",
"eslint": "5.6.1",
"eslint-loader": "2.1.1",
"eslint-plugin-react": "7.11.1",
"webpack": "4.20.2",
"webpack-cli": "^3.1.0",
"webpack-dev-server": "^3.1.5"
},
"dependencies": {
"node": "^10.11.0",
"prop-types": "15.6.2",
"react": "16.5.2",
"react-dom": "16.5.2",
"react-scripts": "2.0.3",
}
}
rules: [
{
test: /\.m?js$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env']
}
}
},
{
test: /\.js$/,
exclude: /node_modules/,
use: ['babel-loader', 'eslint-loader']
},
{
"parser": "babel-eslint",
"plugins": ["react"],
"rules": {
"react/prop-types": ["warn"],
}
}