Eslint和Prettier在vscode编辑器的应用

最近有空，整理代码。
发觉之前做业务的时候，代码都没有规范化。导致有很多不需要的变量在占据着内存空间、命名有的时候也没有按照大小驼峰的方式、vue文件的html也是格式各种各样等等一些规范的问题就找了出来。

其实做规范是比较简单的。在vscode中，尤其简单。步骤如下（以下是windows的vscode操作）：

一：eslint的安装

1、路程：查看 =》 扩展 =》搜索栏中搜eslint =》点击第一个 =》 点击install即可

2、在项目的根目录，找到package.json文件，打开它后找到devDependencies，可以查看eslint的版本号（如果找不到eslint，说明没有安装）；

二、利用配置文件配置想要的效果

路程：文件 =》 首选项 =》 设置 =》 在搜索框中搜索eslint，进行扩展设置，如下图所示

比如说，右侧栏目有选项是打勾的，

自动保存与否。为了更加友好的进行配置，还提供了settings.json文件，我们可以根据自己的需要进行配置。
以下是我项目的一些基本设置：

三、格式化代码的利器Prettier

Prettier是一个强大的格式化代码的利器，它是配合eslint的一款插件。

说它是格式化的工具，但是，它的配置也是会影响代码的，比如说“当箭头函数只有一个参数的时加上括号”，在你代码选择了保存自动修改方式，它就会对你代码进行修改。

以上的方式使用windonws。在MAC中，设置是在code导航栏中的首选项进入。eslint和prettier在mac的一些基础设置和windows会不一样，这个在操作的过程中需要进行对比。