WebStorm运行简单项目报错Jest encountered an unexpected token如何解决

报错根因是Jest默认不会转译node_modules目录下的代码，你依赖的hs-test-web包使用了高版本ECMAScript语法（类实例字段赋值语法），但当前环境的Node.js版本或Jest版本不兼容该语法，所以解析失败。你可以按照以下步骤依次排查：

1. 校验Node.js版本 #

类公有字段语法在Node.js 12.x版本开始支持，14.x及以上版本完全稳定。先确认你当前的Node版本：

• 终端执行node -v，如果版本低于14.x，直接升级到Node.js 14.x或更高的LTS版本
• 升级完成后删除项目的node_modules目录和package-lock.json/yarn.lock文件，重新执行npm install安装依赖，再尝试运行项目

2. 调整Jest配置 #

如果升级Node后问题仍存在，需要修改Jest配置，让其转译hs-test-web这个依赖包：

1. 找到项目根目录下的Jest配置文件，通常是jest.config.js，如果没有就新建一个
2. 在配置中添加transformIgnorePatterns字段，排除对hs-test-web的忽略：

module.exports = {
  // 其他原有配置保留
  transformIgnorePatterns: [
    "node_modules/(?!hs-test-web)"
  ]
}

这个配置的作用是告诉Jest，除了hs-test-web之外，其他node_modules下的包都不需要转译。

3. 核对WebStorm运行配置 #

确认你在WebStorm点击的运行按钮对应的配置类型：

• 你当前项目只有HTML文件，如果是纯前端静态项目，不需要通过Jest测试配置启动，直接右键HTML文件选择「在浏览器中打开」即可运行
• 如果是要求用hs-test-web跑测试的项目，确认WebStorm的运行配置是npm类型，执行的命令是npm test，而不是其他Node运行配置。

内容的提问来源于stack exchange，提问作者Tomek Nowak