运行 来自 WebStorm 界面的新项目崩溃,而来自 shell 的 运行 没有?

Running new project from WebStorm interface crashes while running from shell doesn't?

在一个新的 create-react-app 生成的项目中 npx init create-react-app frontend --template typescript。每当我尝试 运行 start npm 脚本时,都会弹出以下错误:

> frontend@0.1.0 start
> react-scripts start

./frontend/node_modules/webpack-dev-server/lib/Server.js:348
    } catch {
            ^

SyntaxError: Unexpected token {
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)
    at Module._compile (module.js:617:28)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)
    at tryModuleLoad (module.js:506:12)
    at Function.Module._load (module.js:498:3)
    at Module.require (module.js:597:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (./frontend/node_modules/react-scripts/scripts/start.js:28:26)

但是,如果我 运行 直接在 shell 中(来自 WebStorm 的终端或手动打开的终端)它 运行 完全没问题,表明问题出在 WebStorm配置?

仔细检查显示 WebStorm 运行s:

/home/paul/.nvm/versions/node/v16.13.2/bin/node /home/paul/.nvm/versions/node/v16.13.2/lib/node_modules/npm/bin/npm-cli.js run start --scripts-prepend-node-path=auto

运行 在终端中手动操作也可以正常工作。我已经检查了项目设置中选定的 Node 和 TypeScript 版本 - 这些都设置正确(节点设置为 nvm 维护的 16.3.2 和 npm 到相应的版本,TypeScript 基于本地节点模块中的版本).

这个 运行ning 错误的原因是什么(在空白项目上)?什么是解决方案?

按要求截图:

节点设置:


经过更深入的检查,我注意到如果我将 react-scripts5.0.0 降级到 3.4.4。以及从 4.5.53.9.10typescript 它工作正常 - 然而这并不是一个真正可持续的情况。
更深入的检查表明问题确实发生在 react-scripts 版本 4.x

一定是您的 $PATH 有问题,正如 IDE 所看到的那样 - 您必须有一些不支持 optional catch binding 的旧 Node.js 版本。

从 desktop/launch 栏启动时,WebStorm 只能看到在登录 shell 中配置的环境变量,但看不到交互式 shell 配置文件(如 .bashrc.zshrc),因此环境(包括 $PATH)与终端中的环境不同。可能的解决方案:

  • 解决方法 1:通过 moving/copying 将必需的变量在登录 shell 中提供给相应的 shell 配置文件配置
  • 解决方法 2:从终端 运行 IDE 使其继承终端环境
  • 解决方法 3:编辑 IDE 启动器并将命令设置为 /bin/bash -l -i -c "/opt/WebStorm/bin/webstorm.sh"