从0开始配置eslint

在这里插入图片描述
没有在.eslintrc文件中配置parserOptions指定语言版本和模块类型

{
	"parserOptions": {
		"ecmaVersion": 7,	//指定es版本为es2016
		"sourceType": "module", //使用import导入模块
	}
}

在这里插入图片描述
eslint还不能识别jsx语法

{
	"parserOptions": {
		"ecmaVersion": 7,	//指定es版本为es2016
		"sourceType": "module", //使用import导入模块
		"ecmaFeatures": {
			"jsx": true	
		}
	}
}

使用prettier中配置的规则,需要安装eslint-config-prettiereslint-plugin-prettier

{
	"parserOptions": {
		"ecmaVersion": 7,	//指定es版本为es2016
		"sourceType": "module", //使用import导入模块
		"ecmaFeatures": {
			"jsx": true	
		}
	}
	plugins: ['prettier'],
  rules: {
    'prettier/prettier': [
      'error',
      {
        endOfLine: 'auto',
      },
    ],
  },
}

对react hook规则进行校验,需要安装eslint-plugin-react-hooks

module.exports = {
  'parser': '@typescript-eslint/parser',
  "parserOptions": {
    "ecmaVersion": 7,
    "sourceType": "module",
    "ecmaFeatures": {
			"jsx": true	
		}
  },
  plugins: ['prettier', 'react-hooks'],
  rules: {
    'react-hooks/rules-of-hooks': 'error',
    'react-hooks/exhaustive-deps': 'warn',
    'prettier/prettier': [
      'error',
      {
        endOfLine: 'auto',
      },
    ],
  },
}

你可能感兴趣的:(前端)