webstorm（2019）配置eslint规范

在项目中我们为了代码书写更规范，在项目中安装ESlint帮助我们检查语法，那么下面介绍下在webstorm中如何配置ESlint规范

 

步骤如下：

1.快捷键:ctrl+alt+s打开设置，找到Code Style，将Indents Detection和EditorConfig下的去掉勾选，具体看下图

 

2.在Code Style子文件下找到你想修改的文件类型，将缩进全部改为2

 

 3.标签识别，找到HTML，点击进入找到Do not indent children of:，然后点击右边的文件夹，在打开的小窗口中点击“+”，将“script”添加进去。

 

4.检查是否选择的是es6，新版的webstorm默认选择的是es6语法

 

5.webstorm2019的eslint默认没有禁用，检查只要没勾选Disable Eslint就行

 6.上面所有设置完之后点击"ok"，在你的项目下找到“.eslintrc.js”文件，右键----->Apply ESlint Code Style Rules。

 7.最后一步，我们发现export default上面是灰色的提醒，鼠标移上去后发现提示unused export default，这是因为没有具体的使用这个导出，是JavaScript的一个语法提示。快速的方法是：点击右下角的小人头，将进度条拖到none，点击“ configure inspections”找到“unused global symbol”去掉勾选，然后就可以看到灰色的提醒消失了。在格式化代码的时候用快捷键ctrl+alt+L就可以自动整理成符合ESlint风格的代码了。

 

 

扩展 ：

设置webstorm主题

1.选择主题，webstorm默认主题是白色的，如果觉得白色太亮，可根据你的喜好在这里设置成暗一点的颜色

 2、设置字体大小，webstorm默认字体是12号，如果你觉得字体太小可在Font里进行设置

 

 

 

上面这些便是我查找资料后总结的完整版，写下来作为笔记备忘