webpack实战——eslint在webpack中的配置(六)

什么是eslint?
用来约束规范我们的代码

安装eslint工具:

npm install eslint --save-dev

生成配置文件:

npx eslint --init

katedeMacBook-Air:lesson1_5-6 kate$ npx eslint --init
? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? React
? Does your project use TypeScript? No
? Where does your code run? Browser
? How would you like to define a style for your project? Use a popular style guide
? Which style guide do you want to follow? Airbnb: https://github.com/airbnb/javascript
? What format do you want your config file to be in? JavaScript
Checking peerDependencies of eslint-config-airbnb@latest
? The style guide "airbnb" requires eslint@^5.16.0 || ^6.8.0. You are currently using eslint@7.1.0.
  Do you want to downgrade? Yes
The config that you've selected requires the following dependencies:

eslint-plugin-react@^7.19.0 eslint-config-airbnb@latest eslint@^5.16.0 || ^6.8.0 eslint-plugin-import@^2.20.1 eslint-plugin-jsx-a11y@^6.2.3 eslint-plugin-react-hooks@^2.5.0 || ^1.7.0
? Would you like to install them now with npm? (Y/n) y

安装:

npm install babel-eslint --save-dev

.eslintrc.js

module.exports = {
  extends: [
    'airbnb',
  ],
  "parse": "babel-eslint"
};

检查代码:

npx  eslint src

也可以直接使用vcode安装eslint扩展工具