CTRL+S实现Eslint自动格式化

923 阅读1分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第2天,点击查看活动详情

1.下载 eslint

yarn add elsint

2.初始化 eslint

npx eslint --init

选择Eslint规范,这里选择最严格模式,会在编辑器和浏览器同时要求程序员遵守Eslint规范,不遵守就会报错(在编辑器中会以代码提示的方式告诉错误)

选择何种规范来导入导出

选择哪种语言

是否使用 TypeScript

在何种环下运行项目(Browser:默认选择,在浏览器中运行,Node:在node环境中也能运行)

始终何种代码风格,这里选择全新的风格

代码规范遵循何种代码指南

配置文件的文件格式

提示版本过高,是否卸载原有 eslint 版本

安装 eslint 依赖包

3.配置开发工具(vscode)能ctrl+s自动修复格式错误

  • 在vscode中安装eslint插件。
  • 在vscode设置,让eslint插件显示在状态栏"eslint.alwaysShowStatus": true配置 
  • 设置工作区设置 --> 自动创建.vscode/settings.json文件,内容如下:(不要配置 用户级别!不要配置 用户级别!不要配置 用户级别!
{
    "eslint.run": "onType",
    "eslint.options": {
      "extensions": [".js", ".vue", ".jsx", ".tsx"]
    },
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true
    }
}

4.检查效果。 ctrl+s格式化了