解决 vue 中 eslint & 自动程序化prettier冲突

最新推荐文章于 2024-02-06 23:23:57 发布
最新推荐文章于 2024-02-06 23:23:57 发布
阅读量565 收藏 1
点赞数
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_59599421/article/details/132982844
版权

1. 代码出现 Unexpected space before function parentheses 错误

解决方法：找到 .eslintrc.js 文件

 将高亮部分，修改成 'space-before-function-paren': 0

​​2.代码出现 Vue-error xx should be on a new line 错误

解决方法：找到 .eslintrc.js

 找到高亮部分，修改： singleline:11,合理增加即可。

qing.socool
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
vue项目中解决eslint与prettier同时使用时校验冲突问题
cabinx的博客
04-14 5065
vue项目中解决eslint与prettier同时使用时校验冲突问题 1.需求背景 最近在项目已有的代码校验校验工具eslint基础上加入了prettier，其原因也是为了约束开发团队代码风格统一，初衷是好的，但是在实际使用过程中就出现了两个代码校验工具校验冲突问题。 解决方案 其实冲突的根源在于两者对于校验代码格式都有参与，但是两者的校验规则又不一定相同，这就是冲突的根源。 解决的思想就是让eslint专注于代码质量问题的校验，其他的代码风格问题就让prettier来处理就能够解决冲突，具体处
Vue-error xx should be on a new line
热门推荐
qq_36972185的博客
03-19 1万+
此问题是由于.eslintrc.js文件中的vue/max-attributes-per-line配置错误产生的 "vue/max-attributes-per-line": ['error', { "singleline": 10, "multiline": { "max": 1, "allowFirstLine": false } }], 解决方法：改为警告 "vue/max-attributes-per-l
vue项目中ESlint和Prettier规则起冲突
polary_的博客
03-21 1937
在vue项目中，每次保存总会出关于符号的错，要么是双引号要么是末尾分号，但是改了之后又保存就还是恢复原样。 这是因为ESlint的规则和Prettier的规则起冲突，Prettier支持双引号和分号，Eslint不支持。所以可以改变ESlint或者是Prettier的规则。 1.改变Eslint规则，在.eslintrc.js中的rules添加 //"off"或者0 关闭规则 //"warn"或者1 警告 //"error"或者2 错误 rules:{ "quotes": 0 //
vue3新项目要怎么配置eslint和prettier,不让他们冲突
weixin_57649833的博客
11-01 634
创建项目的时候选了eslint和prettier，但是想配置一下让他们按照自己的风格来格式化，以前配置过，但是忘了，研究了一下午，记录一下。6、终端执行这个命令，项目应该就可以跑起来了，需要修改格式化规则或者配置eslint规则往对应的文件里加就行了。2、配置.eslintrc.js,这个是创建项目时选择eslint+prettier脚手架创建的。1、准备工作，安装下这两个插件，禁用下Vetur插件，已经装过的可以忽略。参考了以下大佬的文章，里面有相关的其他的知识详解，可以参考学习。
vue 插件ESLint报错解决方法（持续整理）
lgdaren的博客
03-26 1万+
{ root: true, // 当前配置为根配置，将不再从上级文件夹查找配置 parserOptions: { parser: ‘babel-eslint’, // 采用 babel-eslint 作为语法解析器 sourceType: ‘module’, // 指定来源的类型，有两种script或module ecmaVersion: 6, //指定ECMAScript支持的版本，6为ES6 }, env: { browser: true, // 设置为所需检查的代码是在浏览器环境运行的 es6
ESLint 和 Prettier 配置冲突解决方案
有来技术
05-16 1062
ESLint 和 Prettier 冲突问题和解决方案说明
详解如何在vue项目中使用eslint+prettier格式化代码
10-17
现在，每当保存Vue文件时，Prettier会自动格式化代码，而运行`npm run lint`则会自动修复一些可以通过ESLint解决的问题。如果项目遵循`standard`或`airbnb`等特定风格指南，你可能需要进一步调整配置，以确保`eslint...
Project:基于Spring Boot + Vue的程序
03-26
开发人员还可能使用ESLint进行代码质量检查，Prettier进行代码格式化，Jest或Mocha进行单元测试，确保代码的可靠性和一致性。 总的来说，这是一个集成了Spring Boot强大后端能力和Vue.js高效前端渲染的现代项目。...
vue+Springboot+MongoDB构建的的一个排课系统demo.zip
最新发布
02-22
项目可能还包括Eslint和Prettier进行代码格式化和风格检查，以及Webpack进行前端资源的打包和优化。 这个排课系统演示可能包含以下部分的源代码： - 前端Vue.js项目的`src`目录，包括组件、路由、样式和配置文件。 ...
test-service-management
01-16
`.prettierrc.json`是Prettier的配置文件，Prettier是一个代码格式化工具，用于自动统一代码风格，让代码更易读且减少因格式问题引发的冲突。 `tsconfig.json`是通用的TypeScript配置文件，可以应用于整个项目，当...
spy_escape:这是一个正在开发中的团队建设 Web 应用程序，供团队建设使用
06-25
为了确保代码质量和一致性，团队可能会使用ESLint这样的静态代码分析工具，以及Prettier进行代码格式化。测试方面，JUnit或Mocha可以用于单元测试，而Jest可能是更全面的测试解决方案，包括模拟函数和快照测试。 ...
【VSCode操作手册】prettier和ESlint格式冲突问题解决-Missing space before function parentheses
Txtechcom的博客
02-06 684
prettier和ESlint格式冲突问题解决-Missing space before function parentheses
line warning: binding “gutter“ should be on a new line
灵感点滴的分享
08-06 9483
此问题是由于.eslintrc.js文件中的vue/max-attributes-per-line配置错误产生的 解决办法 根据错误提示更改相关配置即可，更改完成之后重新构建项目。 举例： { "vue/max-attributes-per-line": ["error", { "singleline": 1, "multiline": { "max": 1, "allowFirstLine": false } }] } singleline（nu
配置ESlint代码风格
qq_40576178的博客
12-21 484
在通过vuecli创建项目编写代码时，通常会固定一种代码风格来开发，当有问题时会自动修复问题或者会提示哪里有问题 步骤 1、在vscode中左侧扩展里面安装ESlint插件， 2、配置ESlint插件（监听vue做格式化） 配置文件---> 打开设置---->settings.json 在setting.json中,将代码放在最外侧{}里面即可 "eslint.validate": [ "javascript", "javascriptreact", {
配置过期 eslint-plugin-vue 规则导致 eslint 失效原因定位
皮蛋很白的博客
03-23 7991
今天使用 Vue CLI 创建 Vue 应用，然后从之前的项目中拷贝 ESLint rules，但是 vscode 并没有识别，格式化配置中也没有 ESLint 选项。 一般这种情况应该是 ESLint 配置有问题，可能是插件、解析器或者规则。 一个一个注释后重载 vscode 查看效果，最终定位到 eslint-plugin-vue 下的 vue/max-attributes-per-line 规则： // 强制每行的最大属性数 'vue/max-attributes-per-line': [2, {
Unexpected space before function parentheses报错解决方法
YZJ_Peter的博客
07-03 6197
Unexpected space before function parentheses报错解决方法
vue的mouseover等事件注册失败问题
Mo_zifeng的博客
11-02 2934
在vue项目中用到@mouseover事件，结果发现注册失败，网上搜了之后才知道，在vue中，注册@mouseover等鼠标操作（以mouse为前缀）事件，需要加上.native，例:@mouseover.native。...
Vue中报错This ‘v-if‘ should be moved to the wrapper element
Waghhhh的博客
09-23 1万+
这是由于v-if和v-for冲突。因为v-for比 vi-if的优先级高，这就意味在每个v-for循环中，v-if将重复运行。 只需要将v-if和v-for设置在不同的元素中。
Eslint插件
qq_30817073的博客
09-20 1万+
ESLint旨在完全可配置，这意味着您可以关闭每个规则，只能使用基本语法验证，或者混合并匹配捆绑的规则和自定义规则，使ESLint完美的适用于您的项目。 一、eslint-plugin-vue 地址：https://github.com/vuejs/eslint-plugin-vue 安装： npm install --save-dev eslint eslint-plugin-vue@b
Component name "index" should always be multi-word.eslint
08-21
在Vue中，如果组件的名称只有一个单词（比如"index"），会出现错误提示"Component name 'index' should always be multi-word"。这是因为Vue官方推荐组件的名称应该是由多个单词组成的，以提高可读性和可维护性。 解决这个问题的方法有多种。一种方法是修改组件的名称，使其由多个单词组成，比如将"index"改为"IndexPage"。这样可以避免eslint的命名规则错误提示。 另一种方法是在项目中的.eslintrc.js文件中关闭命名规则检查。可以在规则中添加如下配置：'vue/multi-word-component-names': 'off'。这样eslint就不会再提示该错误了。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [解决：Component name “index“ should always be multi-word](https://blog.csdn.net/weixin_71403100/article/details/130223401)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *2* [【Vue】在vue中命名的时候会遇到 component name “index“ should always be multi-word的解决方案](https://blog.csdn.net/Trees__/article/details/126190961)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值