vue-cli脚手架创建的项目默认使用ESlint规则，启动项目的时候因为各种语法报错，不得不先停下了解一下什么是ESlint，及其相关的一下操作。

【使用vue-cli快速搭建项目】：https://pare": 2,//不能比较自身"no-sequences": 0,//禁止使用逗号运算符"no-shadow": 2,//外部作用域中的变量不能与它所包含的作用域中的变量或参数同名"no-shadow-restricted-names": 2,//严格模式中规定的限制标识符不能作为声明时的变量名使用"no-spaced-func": 2,//函数调用时 函数名与()之间不能有空格"no-sync": 0,//nodejs 禁止同步方法"no-ternary": 0,//禁止使用三目运算符"no-trailing-spaces": 1,//一行结束后面不要有空格

更全面的了解ESlint规则建议点这里 ：

【ESlint 官方规则列表】：http://eslint.cn/docs/rules/

3.如何根据ESlint规则修改代码？

每次改动后启动项目，ESlint都会检测你的代码，然后在浏览器的控制台疯狂报错。一开始我是根据控制台的报错信息，一条一条回去修改的，但是这样的方式太低效。后来同事告诉我一种高效的方式，可以直接让开发工具（webstorm or idea）识别ESlint，并且格式代码，过程是这样的：

Setting ->Preferences -> Languages & Frameworks -> JavaScript -> Code Quality Tools -> Eslint ，然后勾选Enable单选框。

配置ESlint

勾选后你就会发现，idea和webstorm会通过红色的下划线来告诉你，什么地方不符合ESlint规则。这使我们能在开发过程中，就根据ESlint规则修改代码，而不是等到运行项目后，通过控制台才发现语法错误。

ESlint规则提示

除了此之外，idea和webstorm还能一键格式化，让代码按照ESlint规则自动调整。在有语法错误的文件右击，然后点击Fix ESint就好了：

一键格式化

4.如何关闭ESlint语法检测？

这个很简单，build --> webpack.base.conf.js，然后注释掉图片所指那段代码，就可以了。

关闭ESlint语法检测

// test: /\.(js|vue)$/, // loader: 'eslint-loader', // enforce: 'pre', // include: [resolve('src'), resolve('test')], // options: { // formatter: require('eslint-friendly-formatter'), // emitWarning: !config.dev.showEslintErrorsInOverlay // }

去了解如何关闭ESlint检测，是因为一直在报错，挺烦的。

但是比较深入的了解完ESlint后，个人感觉还是挺有必要使用的，对于共同开发，维护代码有这很好的作用。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。