Vue项目中配置ESLint

Vue项目中ESLint基本语法要求

1. JS中的字符串使用单引号包裹
2. 代码结尾不能跟分号
3. 声明的变量和方法必须被调用
4. 代码的最后一行要加换行
5. tab键用多个空格代替, 一个tab键等于2个空格
6. 声明的方法名和圆括号之间加空格

为了适应ESLint语法要求, 前期的准备工作
安装ESLint插件, 实时提示我们代码格式可能出现的问题

安装Prettier插件, 代码保存时, 自动格式化代码

需要如下配置:
如果之前装过Beautify, 可以先卸载掉或者禁用掉, 以免冲突

设置settings.json中添加如下配置

"editor.formatOnSave": true

新建.prettierrc文件

{
  "semi": false,
  "singleQuote": true
}

在.eslintrc.js中添加标红代码

// 注意如果这里eslintrc文件中已经有了rules，只需要替换rules中的属性即可
rules: {
    'no-console': 'off',
    'no-debugger': 'off',
    'space-before-function-paren': 0
  },

关闭自动保存功能

	左上角文件 => 自动保存

重启vscode, 确保修改生效

关闭eslint

在控制台中输入 vue-ui 选择项目包，在配置中点击滑块关闭，重启项目