Vue 3 项目初始化 EditorConfig 的核心是在根目录新建 .editorconfig 文件并启用编辑器插件，统一缩进、换行、空格等基础风格；推荐配置 root = true、indent_style = space、indent_size = 2，并按文件类型差异化设置；需安装对应编辑器插件（如 VS Code 官方插件）并验证生效；应与 Prettier、ESLint 协同分工，避免规则冲突。
Vue 3 项目初始化时配置 EditorConfig，核心是**在根目录新建 .editorconfig 文件，并确保团队成员的编辑器启用了对应插件**。它不依赖构建工具或运行时，而是在编码阶段就统一缩进、换行、空格等基础风格，避免因编辑器默认设置不同导致的协作干扰。
1. 创建 .editorconfig 文件
在项目根目录（与 package.json 同级）新建文件 .editorconfig，内容推荐如下（适配 Vue + TypeScript 主流实践）：
# https://editorconfig.org
root = true
<p>[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
insert_final_newline = true
trim_trailing_whitespace = true</p><p>[*.md]
insert_final_newline = false
trim_trailing_whitespace = false</p><p>[*.{yml,yaml,json,ts,js,vue}]
indent_size = 2
</p>
-
indent_size = 2是 Vue 官方推荐和多数 TS 项目采用的缩进宽度 -
[*.md]单独关闭 Markdown 的末尾换行和空格清理，避免文档渲染异常 -
[*.{yml,...}]显式声明配置范围，增强可读性和可维护性
2. 编辑器插件支持
EditorConfig 配置本身不会自动生效，需编辑器支持：
- VS Code：安装官方插件 EditorConfig for VS Code（微软维护，启用即生效）
- WebStorm / IntelliJ：内置支持，无需额外安装，但需在 Settings → Editor → Code Style 中确认 “Enable EditorConfig support” 已勾选
- 其他编辑器：访问 editorconfig.org/download 查找对应插件
3. 验证是否生效
最直接的方式是手动测试：
Springboot Vue Builder
下载
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
- 新建一个
test.js，输入几行代码后保存，观察缩进是否为 2 个空格 - 在行尾加空格再保存，检查是否被自动删除（
trim_trailing_whitespace = true） - 打开任意
.md文件，确认末尾不会多出空行
若未生效，优先检查插件是否启用、文件是否放在项目根目录、配置语法是否有拼写错误（如 root = true 必须小写且无空格）。
4. 与其他规范工具协同
EditorConfig 是基础层，建议与 Prettier、ESLint 分工协作：
- EditorConfig：管编辑器行为（缩进宽度、换行符、空格清理）
- Prettier：管代码格式（括号位置、引号类型、函数换行等）
- ESLint：管代码质量（潜在 bug、未使用变量、TS 类型错误等）
三者共存时，建议在 Prettier 配置中关闭与 EditorConfig 重叠的选项（如 tabWidth），避免冲突。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
