news 2026/9/23 1:31:28

vue和react缩进规则的配置项如何配置

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
vue和react缩进规则的配置项如何配置

1,找到.eslintrc.js文件

2,找到indent

在 ESLint 的配置中,"indent": ["error", 2]代码缩进规则的配置项,用于强制规范代码的缩进方式,具体含义可以拆解为两部分:

一、配置项的核心含义

  1. 第一部分:error这是规则的严重程度,对应 ESLint 规则的三种级别:

    • off(或0):禁用该规则,不检查缩进。
    • warn(或1):违反规则时触发警告(不会导致 lint 检查失败)。
    • error(或2):违反规则时触发错误(会导致 lint 检查失败,阻断构建 / 提交等流程)。这里的error表示:如果代码缩进不符合要求,ESLint 会将其标记为错误级别。
  2. 第二部分:2这是规则的核心选项,指定缩进的空格数2个。也就是说,代码中每一级缩进必须使用2 个空格,而非制表符(Tab)或 4 个空格等。

二、规则的作用示例

启用该规则后,ESLint 会检查并报错以下情况:

  • 错误示例(使用 4 个空格缩进):

    javascript

    运行

    function foo() { // 这里用了 4 个空格,违反了 2 个空格的规则,会触发 error console.log('hello'); }
  • 正确示例(使用 2 个空格缩进):

    javascript

    运行

    function foo() { // 2 个空格,符合规则 console.log('hello'); }

三、该规则的扩展配置(可选)

indent规则还支持更精细的配置,比如指定缩进使用制表符、对 switch/case 语句的缩进特殊处理等,格式为:

javascript

运行

"indent": ["error", 2, { "SwitchCase": 1, // case 语句相对于 switch 缩进 1 级(即 2 个空格) "VariableDeclarator": { "var": 2, // var 声明的变量缩进 2 个空格 "let": 2, // let/const 声明的变量缩进 2 个空格 "const": 2 }, "outerIIFEBody": 1 // 立即执行函数的体部缩进 1 级 }]

四、常见的缩进配置对比

配置效果适用场景
"indent": ["error", 2]强制 2 个空格缩进React/Vue 等前端项目(主流)
"indent": ["error", 4]强制 4 个空格缩进Node.js/ 后端项目(部分团队习惯)
"indent": ["error", "tab"]强制使用制表符缩进偏好 Tab 的团队

总结

"indent": ["error", 2]的核心作用是强制代码使用 2 个空格作为缩进单位,且违反时触发错误级别提示,这是前端项目中最常用的缩进规范之一,目的是统一团队的代码格式,提升代码可读性。

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/9/21 11:22:41

Langchain-Chatchat能否导出知识图谱可视化结果?

Langchain-Chatchat能否导出知识图谱可视化结果? 在企业知识管理日益智能化的今天,越来越多团队开始尝试将私有文档接入本地大模型系统,实现安全、精准的问答服务。Langchain-Chatchat 作为开源社区中广受关注的本地知识库解决方案&#xff…

作者头像 李华
网站建设 2026/9/21 17:53:43

【必收藏】LangGraph深度研究智能体实战:LangChain官方OpenDeepResearch完整源码解析与本地部署指南

本文深入解析了LangChain官方OpenDeepResearch项目,详细对比了Graph工作流与Multi-Agent多智能体两种架构的设计思路与核心节点,提供了从环境配置、依赖安装到本地部署的完整实践指南。通过源码分析,帮助开发者掌握复杂AI智能体系统的构建方法…

作者头像 李华
网站建设 2026/9/22 19:37:18

Langchain-Chatchat如何评估知识库问答的准确性?

Langchain-Chatchat如何评估知识库问答的准确性? 在企业迈向智能化运营的今天,员工每天可能要面对上百份制度文件、操作手册和政策通知。当一位新入职的HR询问“年假是否可以跨年使用”时,系统是该凭记忆模糊作答,还是从《员工休假…

作者头像 李华