首页 > 其他分享 >eslint-config-prettier和eslint-plugin-prettier有什么关系

eslint-config-prettier和eslint-plugin-prettier有什么关系

时间:2023-08-25 09:34:09浏览次数:41  
标签:plugin eslint prettier ESLint config Prettier

`eslint-config-prettier` 和 `eslint-plugin-prettier` 是用于与 ESLint 和 Prettier 集成的两个不同的包。

1. `eslint-config-prettier` :这是一个 ESLint 配置规则的包,它将禁用与 Prettier 冲突的 ESLint 规则。使用 `eslint-config-prettier` 可以确保 ESLint 规则与 Prettier 的代码格式化规则保持一致,避免二者之间的冲突。

2. `eslint-plugin-prettier` :这是一个 ESLint 插件,它将 Prettier 应用到 ESLint 中。它会使用 Prettier 来格式化代码,并将格式化结果作为 ESLint 的一项规则来检查代码。使用 `eslint-plugin-prettier` 可以在代码检查的同时,自动格式化代码,使其符合 Prettier 的规则。

通常情况下,您需要同时安装这两个包来实现 ESLint 和 Prettier 的集成。首先,使用 `eslint-config-prettier` 禁用与 Prettier 冲突的 ESLint 规则,然后使用 `eslint-plugin-prettier` 将 Prettier 应用到 ESLint 中,以便在代码检查时自动格式化代码。

下面是一个示例 `.eslintrc.js` 配置文件,展示了如何同时使用 `eslint-config-prettier` 和 `eslint-plugin-prettier` :

module.exports = {
    extends: ["eslint:recommended", "plugin:prettier/recommended"],
    plugins: ["prettier"],
    rules: {
        // 可以添加其他自定义规则
    },
};

 


通过这样的配置,您可以同时享受到 ESLint 的代码检查功能和 Prettier 的代码格式化功能,并确保二者之间的规则一致性。

 

标签:plugin,eslint,prettier,ESLint,config,Prettier
From: https://www.cnblogs.com/johnjackson/p/17656025.html

相关文章

  • Spring源码搭建导依赖时报错:Failed to apply plugin 'kotlin'.
    原因是kotlin插件的版本与gradle中指定的版本不一致,我的是1.8.0,spring5.3.x版本gradle配置文件指定的kotlin版本是1.5.32,修改成1.8.0......
  • vue eslint 报错 error “Component name “*****“ should always be multi-word”,该
    出现的问题: 在 vue-cli 创建的项目中,创建文件并命名后,会报  “Componentname"*****"shouldalwaysbemulti-word”  报错;报错截图示例如下:Componentname"******"shouldalwaysbemulti-word.eslintvue/multi-word-component-names报错的原因: 在组件命......
  • Java踩坑1.Plugin org.apache.maven.plugins:maven-install-plugin:2.5 could not
    首次运行maveninstall或任何一个插件时,报错:Downloadingfromhuaweicloud:https://repo.huaweicloud.com/repository/maven/org/apache/maven/plugins/maven-install-plugin/2.5/maven-clean-plugin-2.5.pom[INFO]---------------------------------------------------------......
  • vite 找不到依赖模块:[plugin:vite:dep-pre-bundle]
    问题描述:运行项目时,出现[plugin:vite:dep-pre-bundle]错误。这种问题一般为依赖的包未正常配置相关字段,导致vite无法找到包的入口。遇到这种模块内、找不到引用模块的,都可以用路径别名来解决解决办法://vite.config.jsalias:[{find:'fs',replacement:'node_modules/......
  • 怎么关闭eslint语法检查
    注:真实开发项目不建议关闭vue-cli创建的项目,在vue.config.js文件里面//vue.config.jsconst{defineConfig}=require('@vue/cli-service');module.exports=defineConfig({lintOnSave:false,})vite创建的项目,在vite.config.js文件里面import{def......
  • pinia持久化存储插件-pinia-plugin-persistedstate
    pinia-plugin-persistedstate丰富的功能可以使PiniaStore的持久化更易配置:与vuex-persistedstate相似的API所有Store均可单独配置自定义storage和数据序列化恢复持久化数据前后的hook每个Store具有丰富的配置兼容Vue2和3无任何外部依赖安装使用你喜......
  • 关闭ESlint/路径起别名/配置前端代理/引入模块报错
    怎么关闭ESlint语法检查(不建议)vue-cli创建的项目,在vue.config.js​文件里面//vue.config.jsconst{defineConfig}=require('@vue/cli-service');module.exports=defineConfig({lintOnSave:false,})vite创建的项目,在vite.config.js​文件里面import......
  • vu3+vite项目单独添加ESLint
    安装完依赖后,项目的根目录下会自动生成.eslintrc.cjs文件如下:module.exports={"env":{"browser":true,"es2021":true},"extends":["standard-with-typescript","plugin:vue......
  • ESLint和Prettier冲突
    问题:同时使用ESLint和Prettier时,在某行代码到达某长度时候出现警告线。ESLint推荐换行(手动换行警告消除)但保存(自动格式化后)被Prettier强制拉到同一行(貌似是本行代码长度已经碰到ESLint的逆鳞但未触及Prettier?) 解决: 默认vscode里设置了Prettier的PrintWidth为80 而默认......
  • 利用uplugin对比Webpack和Rollup插件系统
    本文由华为云云岭团队松塔同学分享~江湖上一直流传一种说法:Rollup的插件系统设计,相比与webpack,要更加科学顺手。(网络上对webpack插件编写的吐槽不计其数)Talkischeap,本文基于unplugin这个三方库来对比研究一下二者的插件系统。Unplugin是一个插件编写工具,它可以让开发者用......