editorconfig规则优先于vscode设置,一旦存在对应配置(如indent_size=2),vscode将忽略自身tabsize等设置;需在prettier.config.js中显式同步tabwidth等参数以协同prettier。

EditorConfig规则缺失时,VSCode设置才生效
VSCode的editor.tabSize、files.insertFinalNewline这类设置,只在.editorconfig里没定义对应规则时起作用。一旦.editorconfig写了indent_size = 2或insert_final_newline = true,VSCode就强制遵守它,完全忽略你手动改的设置。
这意味着:你在设置里把缩进调成4空格,但项目根目录有.editorconfig且含indent_size = 2,保存后仍是2空格——不是插件失效,是EditorConfig赢了。
- 调试时可临时重命名
.editorconfig为.editorconfig.bak,看格式化是否“突然正常”,快速验证是不是它在主导 - 团队项目中,
.editorconfig应作为唯一缩进/换行/字符集来源,避免开发者各自调VSCode设置造成不一致 -
editor.detectIndentation设为false能防止VSCode根据文件内容自动重设缩进,否则可能和.editorconfig冲突(比如文件开头是4空格,VSCode就强行切到4,覆盖配置)
EditorConfig与Prettier规则打架的典型表现
两者都管缩进、引号、末尾换行,但优先级和行为逻辑不同:.editorconfig只影响编辑器行为(如新建行缩进多少),而Prettier会重写整行甚至整个节点。当它们不一致时,你会看到:
- 保存后缩进变成2空格(EditorConfig生效),但引号被转成双引号(Prettier生效)——说明Prettier没读取
.editorconfig,各自为政 - 文件末尾多了空行(Prettier加的),但
.editorconfig里写了insert_final_newline = false——此时VSCode不会阻止Prettier,因为那是格式化器自己的决定 -
end_of_line = lf和Git的core.autocrlf = true共存,提交后diff里全是^M,表面格式化正常,实际换行符已错乱
如何让EditorConfig和Prettier协同工作
关键不是“谁听谁的”,而是明确分工:.editorconfig管基础编辑体验(缩进、换行符、字符编码),Prettier管代码结构美化(括号位置、链式调用换行、属性排序)。要做到这点,得主动切断Prettier对EditorConfig的“误读”。
- Prettier 不读取
.editorconfig,所以别指望它自动适配里面的indent_size;必须在prettier.config.js或.prettierrc里显式写tabWidth: 2、endOfLine: 'lf' - 如果项目同时用ESLint,禁用
eslint-config-prettier里的indent、linebreak-style等与EditorConfig/Prettier重复的规则,否则三方混战 - 运行
npx prettier --debug-check src/index.js可确认Prettier是否加载成功;若失败,错误信息里常含Cannot find module 'prettier'或配置解析错误,和EditorConfig无关
容易被忽略的EditorConfig加载边界
VSCode只在打开的文件路径下向上查找.editorconfig,且只认根目录或子目录里的文件。它不会跨工作区、不读符号链接目标、也不处理多根工作区中未激活根目录的配置。
- 多根工作区中,只有“活动根目录”下的
.editorconfig生效;其他根目录的配置被静默忽略 - 用
file://协议打开单个文件(非项目目录),VSCode根本不会加载任何.editorconfig -
.editorconfig语法错误(如漏写charset = utf-8后的换行、用了中文冒号)会导致整份配置被跳过,VSCode不报错,直接 fallback 到自身默认值











