⚙️ VSCode TypeScript 专属效率设置大全 (纯 settings.json 配置)

// .vscode/settings.json
{/* 🔍 引用与类型追踪 */"typescript.referencesCodeLens.enabled": true,      // 显示引用计数(点击查看所有引用处)"typescript.implementationsCodeLens.enabled": true, // 显示实现接口的计数"typescript.tsserver.trace": "off",                 // 关闭TS服务器日志(提升性能)/* 💡 智能提示增强 */"typescript.suggest.completeFunctionCalls": true,   // 自动补全函数调用括号"typescript.suggest.autoImports": true,             // 自动导入建议"typescript.suggest.paths": true,                   // 路径别名建议"typescript.preferences.renameShorthandProperties": true, // 简化对象属性重命名/* 🧪 实验性功能 */"typescript.tsserver.experimental.enableProjectDiagnostics": true, // 实时全项目错误检查/* 📝 编辑体验优化 */"typescript.updateImportsOnFileMove.enabled": "always",  // 移动文件时自动更新导入"editor.quickSuggestions": {                           // 快速建议触发"strings": true,"comments": false,"other": true},"typescript.preferences.importModuleSpecifier": "non-relative" // 优先使用非相对路径
}

🎯 核心配置详解：

1. 引用追踪增强 (referencesCodeLens)

"typescript.referencesCodeLens.enabled": true

✅ 效果：

• 在每个函数/类/变量上方显示 3 references
• 点击可直接跳转到所有引用位置

2. 自动导入优化 (autoImports)

"typescript.suggest.autoImports": true

✅ 效果：

• 输入未导入的模块时自动提示
• 选择后自动添加import语句

3. 文件移动同步 (updateImportsOnFileMove)

"typescript.updateImportsOnFileMove.enabled": "always"

✅ 效果：

• 重命名/移动文件时自动更新所有引用路径
• 防止出现"找不到模块"错误

4. 路径导入策略 (importModuleSpecifier)

"typescript.preferences.importModuleSpecifier": "non-relative"

✅ 效果：

// 优先使用：
import Button from '@/components/Button'// 而不是：
import Button from '../../components/Button'

🏁 性能调优建议：

{"typescript.tsserver.maxTsServerMemory": 4096,  // 调高TS内存(解决大型项目卡顿)"typescript.tsserver.watchOptions": {          // 优化文件监听"watchFile": "useFsEvents","watchDirectory": "useFsEvents"},"typescript.suggest.includeAutomaticOptionalChainCompletions": true // 可选链自动补全
}

🔚 最终配置模板：

// .vscode/settings.json
{// ===== 核心功能 ====="typescript.referencesCodeLens.enabled": true,"typescript.updateImportsOnFileMove.enabled": "always","typescript.suggest.autoImports": true,// ===== 智能提示 ====="typescript.suggest.completeFunctionCalls": true,"typescript.preferences.importModuleSpecifier": "non-relative","typescript.suggest.includeCompletionsForImportStatements": true,// ===== 性能优化 ====="typescript.tsserver.experimental.enableProjectDiagnostics": true,"typescript.tsserver.maxTsServerMemory": 4096
}

💡 提示：所有配置均需在包含tsconfig.json的TypeScript项目中生效
🔄 更新后请重启VSCode或执行> TypeScript: Restart TS server命令