ESLint 和 Prettier 配置冲突解决方案

简介: ESLint 和 Prettier 配置冲突解决方案

问题

项目使用 ESLint 做代码规范检查,使用 Prettier 进行代码格式化,因为二者在配置上的冲突导致类似如下的警告


'xxx' should be on a new line. eslint

1


微信图片_20230710104808.png

解决方案

根据 vuejs 官方的 ESLint 配置 https://eslint.vuejs.org/user-guide/#usage ,其中有讲到如何解决 ESLint 和 Prettier 配置冲突的问题


微信图片_20230710104811.png


安装 eslint-config-prettier 依赖


npm i -D eslint-config-prettier

1

配置 .eslintrc.cjs


 extends: [

   // 参考vuejs官方的eslint配置: https://eslint.vuejs.org/user-guide/#usage

   "plugin:vue/vue3-recommended",

   // 覆盖 ESLint 配置,确保 prettier 放在最后

   "prettier",

 ]



再回去看 ESLint 的警告已经没有了


微信图片_20230710104829.png


附件

项目源码:https://gitee.com/youlaiorg/vue3-element-admin


历史文章:【vue3-element-admin】ESLint+Prettier+Stylelint+EditorConfig 约束和统一前端代码规范


相关文章
|
程序员 数据库 开发者
值得收藏!如何快速画出一幅漂亮的架构图
这篇文章总结了常用的架构图类型,可以借鉴笔者提供的模板,快速地产出符合业务需要的架构图。
162413 95
|
缓存 API 数据库
GraphQL(一)基础介绍及应用示例
本文为GraphQL的基础介绍及应用示例,主要介绍GraphQL的应用场景、优缺点及基础语法与使用。 GraphQL 是一个用于 API 的查询语言,是一个使用基于类型系统来执行查询的服务端运行时(类型系统由你的数据定义)。GraphQL 并没有和任何特定数据库或者存储引擎绑定,而是依靠你现有的代码和数据支撑。
|
关系型数据库 MySQL 网络安全
Mysql8.0 开启 SSL加密 mysql_ssl_rsa_setup
Mysql8.0 开启 SSL加密 mysql_ssl_rsa_setup
2233 0
|
机器学习/深度学习 数据采集 PyTorch
高效数据加载与预处理:利用 DataLoader 优化训练流程
【8月更文第29天】 在深度学习中,数据加载和预处理是整个训练流程的重要组成部分。随着数据集规模的增长,数据加载的速度直接影响到模型训练的时间成本。为了提高数据加载效率并简化数据预处理流程,PyTorch 提供了一个名为 `DataLoader` 的工具类。本文将详细介绍如何使用 PyTorch 的 `DataLoader` 来优化数据加载和预处理步骤,并提供具体的代码示例。
2214 1
热电材料:温差发电的绿色能源技术
【10月更文挑战第17天】温差发电技术利用热电材料将热能直接转换为电能,具有环境友好和高效的特点。本文介绍了热电材料的基础知识、温差发电的工作原理及应用案例,包括人体体温发电、海洋温差发电和工业余热利用,并展望了热电材料的未来发展。
|
Python
深入理解Python中的类方法、类实例方法和静态方法
深入理解Python中的类方法、类实例方法和静态方法
383 0
|
机器学习/深度学习 定位技术
ICLR 2024 Spotlight:连续数值分布式表征加持,浙大UIUC让语言模型擅长表格预测
【6月更文挑战第23天】在ICLR 2024会议上,浙大和UIUC的研究团队推出TP-BERTa,一种改进的BERT模型,专为表格预测。通过将连续数值特征转为文本并利用自注意力机制,TP-BERTa能有效处理高维、异构表格数据,提高预测性能。预训练和微调策略使其在XGBoost等传统方法及FT-Transformer等深度学习模型中脱颖而出。论文链接:[anzIzGZuLi](https://openreview.net/pdf?id=anzIzGZuLi)
335 5
|
前端开发 JavaScript 算法
程序技术好文:高德地图经纬度坐标拾取工具
程序技术好文:高德地图经纬度坐标拾取工具
886 0
|
Linux 异构计算 Docker
QAnything本地知识库问答系统:基于检索增强生成式应用(RAG)两阶段检索、支持海量数据、跨语种问答
QAnything本地知识库问答系统:基于检索增强生成式应用(RAG)两阶段检索、支持海量数据、跨语种问答
QAnything本地知识库问答系统:基于检索增强生成式应用(RAG)两阶段检索、支持海量数据、跨语种问答
|
JavaScript
vue 报错-Module not found: Error: Can't resolve 'element-plus' in '
vue 报错-Module not found: Error: Can't resolve 'element-plus' in '
571 1