解决vscode中Prettier和ESLint冲突的问题

最新推荐文章于 2024-05-12 12:24:47 发布
最新推荐文章于 2024-05-12 12:24:47 发布
阅读量916 收藏
点赞数
文章标签： vscode 前端 javascript react
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/islanddddddd/article/details/127681519
版权

错误信息

[eslint] 
src/App.jsx
  Line 7:13:  Missing space before function parentheses  space-before-function-paren

 原因

Prettier和ESLint，前者是格式化工具，后者是代码检查工具，现在的错误是函数名和圆括号()之间应该有一个空格，但是两位的代码规范不一致，就导致了Prettier格式化的格式跟ESLint想要的不一致。

解决方法

因为Prettier的配置文件里没有这项的设置，虽然网上有直接无视ESLint的方法，但我不想无视因为比较懒。

所以最终决定安装Prettier ESLint插件，它可以按照ESLint的格式去格式化。

按照官方文档的教程配置一下，再设置默认用Prettier ESLint格式化，就可以了。

 成功

 

 

islanddddddd
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Dilettantes-Linting指南：设置ESLint，Prettier，VS Code和AirBnB样式指南，实现美丽和谐
02-04
Prettier可以和ESLint结合使用，通过`eslint-plugin-prettier`和`eslint-config-prettier`插件，避免两者之间规则的冲突。安装并配置好Prettier后，每次保存文件，VS Code（Visual Studio Code）可以通过相应的扩展...
vue项目中使用eslint+prettier规范与检查代码的方法
11-21
在Vue项目中，为了保证代码质量和团队协作的顺畅性，我们常常使用ESLint和Prettier来实现代码规范和检查。这两个工具可以帮助我们避免低级错误，统一代码风格，并提高代码可读性和维护性。 首先，ESLint是一个静态...
使用vscode格式化vue代码是 函数后面的空格被吃
丁七岁的博客
06-11 682
Missing space before function parentheses 安装这个插件，好用！！！ 配置： "[vue]": { "editor.defaultFormatter": "rvest.vs-code-prettier-eslint" }, "vetur.format.defaultFormatter.js": "prettier-eslint",
2023.01.17 解决vscode使用prettier格式化代码时格式与eslint冲突
小龙跳动的博客
02-09 802
因为 prettier 插件格式化格式目前是比较完美的，然后格式化后与 eslint 检验代码的的差异全在于以上代码。（大部分人不喜欢 prettier 格式化后把 html 标签的属性都换行展示，显示代码页很长，把长度设置成180或者自定义长度就能解决这个问题。2、在prettier插件直接勾选或者反勾选配置，最后生成以下代码。1、点开设置-点开右上角的设置代码化。
vscode中的Prettier 插件：格式化代码
最新发布
听海边涛声
05-12 992
vscode中的Prettier 插件：格式化代码
【解决】vue项目vscode配置eslint不生效，无法自动检测
Run_youngman的博客
05-19 6661
解决eslint配置不生效的问题。
vscode，解决ESLint与Prettier冲突问题
y1238r的博客
08-25 3282
vscode，如果项目遵循eslint规则，使用prettier插件格式化，两者会冲突。主要思想：解决eslint和prettier冲突问题。
vscode 配置vue+vetur+eslint+prettier自动格式化功能
10-15
在 .eslintrc.js 文件中，可以引入相关插件，如 `@vue/eslint-config-prettier` 和 `eslint-plugin-prettier`，以解决两者之间的冲突。 为了实现保存时自动格式化，还需要创建一个名为 .prettierrc 的文件，以...
详解如何在vue项目中使用eslint+prettier格式化代码
10-17
在VSCode这样的编辑器中，安装`Eslint`、`Vetur`和`Prettier - Code formatter`插件。在`settings.json`中配置以下内容，以便在保存时自动格式化代码和应用ESLint修复： ```json { "editor.formatOnSave": true, ...
Vue-cli Eslint在vscode里代码自动格式化的方法
08-27
如果想要在保存文件时自动修复代码错误和格式问题，可以启用 Eslint 的 `autoFixOnSave` 功能。首先，确保全局或本地安装了 `eslint-plugin-vue` 插件，然后在项目根目录下创建 `.eslintrc` 或 `.eslintrc.js` 文件...
【VSCode操作手册】prettier和ESlint格式冲突问题解决-Missing space before function parentheses
Txtechcom的博客
02-06 695
prettier和ESlint格式冲突问题解决-Missing space before function parentheses
Vscode Vue3 格式化后报错space-before-function-paren
Xander_He的博客
12-14 635
进入setting 搜索Format:Insert Space Before Function Parenthesis javascript和typescript 都勾选上，重新格式化就Ok了
eslintrc与Vscode
大山博客
03-06 318
不同的开发人员安装的vscode可能不太一致，导致在开发时运行一直报缩进、空格等问题 解决方案： 如果遇到 ‘方法前要加缩进’，‘文本缩进没有对齐’ 等情况！ Missing space before function parentheses space-before-function-paren 可以修改配置文件或是将自己vscode配置修改一下，通常选择修改自己vscode兼容大家项目； 在项目根目录.eslintrc.js配置文件添加如下代码： ‘space-before-function.
vs code 使用 prettier 格式化 js 的时候, 函数定义的名称和括号之间有一个空格, 而 eslit 又不允许这个空格.
galoiszhou的博客
06-14 5978
vs code 使用 prettier 格式化 js 的时候, 函数定义的名称和括号之间有一个空格, 而 eslit 又不允许这个空格.
【VSCode操作手册】prettier和ESlint格式冲突问题解决2-Missing space before function parentheses
Txtechcom的博客
02-07 697
prettier和ESlint格式冲突问题解决2-Missing space before function parentheses。之前写了一篇基于Prettier ESLint插件，有时Prettier ESLint插件不好用无反应，于是有了这一篇基于Prettier插件的配置。
vscode内prettier与eslint格式化规则冲突原因和方案剖析
liixnhai的博客
12-17 3904
问题现象 vscode内，js、vue文件保存时格式化程序冲突，出现死循环。 原因分析 1、vscode的扩展eslint默认开启检测和修复代码。 2、vscode 设置里可以配置onsave时开启formate，并配置格式化使用的程序，有时默认配置了用prettier格式化。 3、prettier与eslint格式化规则冲突了。 解决方案 方案一：将用户与工作区的format on save都关掉（最快解） 方案二：如不关闭format on save ，也可以将用户与工作区的其中一个的format on
error Missing space before function parentheses space-before-function-paren 反复修改无效
追梦小狂魔的博客
03-25 272
搜到很多结果都是.eslintrc.js文件的rules中加 ‘space-before-function-paren’: 0 尝试了很多次只有这一种方案 最重要的是务必重启应用！！！ 重启vscode没用！！！
[ eslint 设置 ]vue运行报错 Missing space before function parentheses space-before-function-paren
Monesy__的博客
04-20 888
Missing space before function parentheses space-before-function-paren
vscode 中 prettier 和 ESLint 冲突解决
u011705725的博客
05-19 2611
问题 有一天，领导让接手了个带有 eslint 配置的老项目，这个 eslint 配置是打在 node_modules 里。 在熟悉的代码时候，我调制并保存了下，此时由于 VS Code 安装了 prettier 插件，采用 prettier 对代码进行了格式化，可此时在终端报了各种错误，如下图： 这是由于 eslint 跟 prettier 在校验上的不一致，由于在 VS Code 的 setting.json 里配制了 "editor.formatOnSave": true // 保存就格式化 修复
在 monorepo 中使用 prettier 和 eslint
09-06
在 monorepo 中使用 prettier 和 eslint 可以非常有效地帮助我们统一代码风格并保持代码质量。 首先，Prettier 是一个代码格式化工具，它能够自动识别代码中的格式问题，并通过自动化调整代码格式，使其在项目中保持一致。在 monorepo 中使用 Prettier 可以确保不同子项目的代码风格保持一致，避免因为多人协作或者多个子项目而导致的格式不一致的问题。可以通过在 monorepo 的根目录中配置 Prettier，并在各个子项目中使用相同的配置文件来实现统一的代码格式。 而 Eslint 是一个静态代码分析工具，可以帮助我们检查代码中的潜在问题、错误和不规范的写法。在 monorepo 中，使用 Eslint 可以帮助我们规定一致的代码质量标准，并对代码进行自动化的检查。可以在 monorepo 的根目录中配置 Eslint，并在各个子项目中使用相同的配置文件，以保持一致的代码规范。 同时，在 monorepo 中使用 prettier 和 eslint，我们可以通过版本控制工具（如 Git）在团队协作中实现持续集成和自动化的代码格式检查。当代码提交到版本控制工具时，可以配置钩子（hooks）来触发 Prettier 和 Eslint 的检查，并在检查不通过时阻止代码提交，从而确保每个提交的代码都符合团队的要求。 总结来说，在 monorepo 中使用 prettier 和 eslint 可以帮助我们统一代码格式和质量标准，提高开发效率，减少潜在问题和维护成本。但需要注意，在配置过程中要保持一致的配置文件，并在团队中进行培训和沟通，以确保所有开发者都能正确使用这些工具。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值