vue-cli4中使用eslint，保存时自动格式，经典面试问题及回答及答案

在Vue CLI 4中使用ESLint进行代码格式检查并在保存时自动格式化，你需要做以下几步：

1. 安装ESLint和相关插件：

npm install eslint eslint-plugin-vue --save-dev

2. 安装Prettier插件以及ESLint插件，用于代码格式化：

npm install eslint-plugin-prettier eslint-config-prettier --save-dev

3. 在项目根目录下创建.eslintrc.js配置文件，并配置以下内容：

module.exports = {
  root: true,
  env: {
    node: true,
  },
  extends: [
    'plugin:vue/essential',
    'eslint:recommended',
    'plugin:prettier/recommended',
  ],
  rules: {
    // 自定义规则
  },
  parserOptions: {
    parser: 'babel-eslint',
  },
};

4. 安装并配置保存时格式化工具eslint-plugin-vue：

npm install eslint-plugin-vue --save-dev

5. 在package.json中添加一个脚本来运行ESLint：

"scripts": {
  "lint": "eslint --ext .js,.vue src"
}

6. 安装并配置编辑器插件，以便在保存文件时自动运行ESLint：

对于Visual Studio Code编辑器，你需要安装以下两个插件：

• ESLint
• Vetur

然后，在VS Code设置中添加以下配置：

{
  "editor.formatOnSave": false,
  "eslint.autoFixOnSave": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "vue",
      "autoFix": true
    }
  ]
}

请注意，具体的配置可能会根据你的开发环境和个人偏好有所不同，上述步骤提供了一个基本的指南。