如何利用VSCode的jsconfig.json或tsconfig.json提升开发体验-VSCode-PHP中文网

如何利用VSCode的jsconfig.json或tsconfig.json提升开发体验

P粉986688829

发布： 2025-12-17 06:51:36

原创

190人浏览过

合理配置jsconfig.json或tsconfig.json可显著提升VSCode智能提示等体验：①通过baseUrl和paths支持路径别名；②用exclude排除干扰文件加快响应；③TS项目启用strict等严格类型检查；④设置moduleResolution等统一模块解析行为。

如何利用vscode的jsconfig.json或tsconfig.json提升开发体验

通过合理配置 jsconfig.json（JavaScript 项目）或 tsconfig.json（TypeScript 项目），VSCode 能更准确地理解代码结构，显著提升智能提示、跳转、重构和错误检查的体验。

精准路径别名支持（@/components → src/components）

避免写一长串相对路径（如 ../../../utils/dateHelper），用别名让导入更清晰、可维护性更强。

在 jsconfig.json 或 tsconfig.json 中配置 "baseUrl" 和 "paths"：

{ "compilerOptions": { "baseUrl": ".", "paths": { "@/*": ["src/*"], "@api/*": ["src/api/*"], "@utils/*": ["src/utils/*"] } }, "include": ["src/**/*"] }

保存后 VSCode 会立即识别这些别名，支持自动补全、Ctrl+点击跳转，且 ESLint / TypeScript 不再报“无法解析模块”错误。

排除干扰文件，加快索引与提示响应

默认情况下，VSCode 可能扫描 node_modules、构建产物或测试文件，拖慢语言服务响应速度，甚至导致错误提示错乱。

用 "exclude" 明确告诉 VSCode 哪些目录不用参与类型检查和智能感知：

"exclude": [ "node_modules", "dist", "build", "coverage", "**/*.test.ts", "**/__mocks__" ]

注意：排除不影响你编辑这些文件，只影响语言功能的分析范围 —— 小项目可能不明显，中大型项目能明显感觉到提示变快、内存占用降低。

启用严格类型检查（TS 项目尤其关键）

TypeScript 的类型能力只有在正确开启相关选项时才能真正发挥作用。基础配置常遗漏关键项，导致“有 TS 名字，没 TS 效果”。

B2S商城系统

B2S商城系统B2S商城系统是由佳弗网络工作室凭借专业的技术、丰富的电子商务经验在第一时刻为最流行的分享式购物（或体验式购物）推出的开源程序。开发采用PHP+MYSQL数据库，独立编译模板、代码简洁、自由修改、安全高效、数据缓存等技术的应用，使其能在大浏览量的环境下快速稳定运行，切实节约网站成本，提升形象。注意：如果安装后页面打开出现找不到数据库等错误，请删除admin下的runtime文件夹和a