Skip to content
On this page

在 React 项目中使用 ESLint

经过之前的实战,我们对 ESLint 的理解应该是比较深入了,接下来我们就应该在实际的框架级应用中去使用 ESLint 来为我们的应用保驾护航了🚢~

目标

  • 初始化 React 项目
  • 初始化 ESLint
  • 在 React 项目中运行 ESLint

Coding

  • 使用pnpm dlx create-react-app ./react-project 创建 React 项目

image-20220701000815553

  • 创建好项目后,进入项目根目录,运行eslint --init进入命令行界面初始化 ESLint

image-20220630233825420

  • 在项目添加 lint 的 script 并运行pnpm run lint

image-20220701001449392

效果

运行 lint 脚本后的效果

image-20220701002252640

如何修复上面的错误呢,我们需要在.eslintrc中配置一些参数来修复它们

image-20220701002459095

再次运行 lint,可以看见没有任何lint错误信息了

image-20220701002547095

Released under the MIT License.