VS Code中jsconfig.json的compilerOptions作用及编辑器用途解析

VS Code里的jsconfig.json里，compilerOptions下的target和module选项确实和Webpack这类打包工具的实际编译打包流程没关系，但它们是给编辑器的语言服务干活用的——VS Code的JS智能提示、语法校验这些功能，底层靠的是TypeScript的语言服务引擎，这些配置就是告诉引擎该用什么规则来解读你的JS代码。

target选项的实际用途 #

• 它用来指定编辑器要加载的默认类型定义库（比如lib.d.ts），不同的target对应不同ECMAScript版本的API支持。比如你把target设成es5，编辑器就会清楚你的代码运行环境不支持ES6的Promise、箭头函数这些特性，一旦你写了这类代码，就会及时给出提示或警告；如果设成esnext，就会开启所有最新ES特性的类型校验和智能补全。
• 核心就是让编辑器准确识别你的代码运行环境支持哪些JS特性，避免出现“环境不支持却没提示”或者“明明环境支持还报错”的尴尬情况。

module选项的实际用途 #

• 它是告诉编辑器你的代码用的是什么模块系统规范，比如commonJS对应Node.js的require语法，es2015对应ES模块的import/export。编辑器会根据这个配置来校验模块导入导出的语法是否合规，同时提供正确的模块路径智能补全。
• 举个例子：如果module设成commonJS，你写import语法时编辑器可能会提示你当前模块系统不支持；如果设成es2015，则会对require语法给出相应提示，而且在你输入模块路径时，会按照ES模块的规则帮你补全文件路径。

说白了，这些配置就是给编辑器的语言服务提供代码的运行上下文，让它能更精准地做语法校验、智能补全、错误提示这些工作——虽然我们不用tsc来编译JS代码，但VS Code是靠TypeScript引擎来处理JS的语言服务的，所以这些TypeScript风格的配置就成了编辑器理解JS代码环境的关键。

内容的提问来源于stack exchange，提问作者Steve Bennett