如何同时使用prettier和eslint,请详细列出来
时间: 2024-05-09 07:18:23 浏览: 19
首先,您需要在项目中安装 prettier 和 eslint 模块,可以使用以下命令进行安装:
```
npm install prettier eslint --save-dev
```
接下来,在项目根目录下创建 .eslintrc.js 文件,并添加以下内容:
```javascript
module.exports = {
extends: ['plugin:prettier/recommended'],
plugins: ['prettier'],
rules: {
'prettier/prettier': 'error',
},
};
```
在这个配置中,我们引入了 eslint-config-prettier 插件依赖,并将其作为 eslint 的一个扩展。而 rules 部分, 我们添加了一条 "prettier/prettier": "error" 规则,以确保所有违反 prettier 风格的代码都会被标记为错误。
接下来,在项目根目录创建 .prettierrc.js 文件,并进行 prettier 的配置。例如:
```javascript
module.exports = {
semi: true,
trailingComma: 'all',
singleQuote: true,
printWidth: 100,
};
```
最后,在 package.json 文件的 scripts 部分,添加以下命令:
```json
"scripts": {
"lint": "eslint . --ext .js,.jsx && prettier . --check"
}
```
现在,您可以使用以下命令同时运行 eslint 和 prettier:
```
npm run lint
```
该命令将运行 eslint 并使用 --ext .js,.jsx 选项拉取所有 .js 和 .jsx 文件进行 linting;并在运行 prettier 之前使用 --check 选项进行检查。
以上就是同时使用 prettier 和 eslint 的完整流程。
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)