执行gatsby develop时遇Unexpected token '.'错误求解决方案

操作背景 #

• 使用以下命令创建Gatsby项目：

gatsby new static-website https://github.com/gatsbyjs/gatsby-starter-default

• 执行gatsby develop启动开发服务时，抛出错误：

root@app01:~/static-website# gatsby develop
gatsby develop

启动开发服务器。监听文件变化，自动重建并热重载

选项：
  --verbose                   开启详细输出                                                                                                   [布尔值] [默认值: false]
  --no-color, --no-colors     关闭输出颜色                                                                                             [布尔值] [默认值: false]
  -H, --host                  设置主机，默认localhost                                                                                     [字符串] [默认值: "localhost"]
  -p, --port                  设置端口，默认8000                                                                                               [字符串] [默认值: "8000"]
  -o, --open                  在默认浏览器中打开网站                                                                                          [布尔值]
  -S, --https                 使用HTTPS，参考指南：https://www.gatsbyjs.org/docs/local-https/                                                                      [布尔值]
  -c, --cert-file             自定义HTTPS证书文件（相对路径；需同时指定--https和--key-file），参考：https://www.gatsbyjs.org/docs/local-https/   [字符串] [默认值: ""]
  -k, --key-file              自定义HTTPS密钥文件（相对路径；需同时指定--https和--cert-file），参考：https://www.gatsbyjs.org/docs/local-https/   [字符串] [默认值: ""]
  --open-tracing-config-file  追踪器配置文件（兼容OpenTracing），参考：https://gatsby.dev/tracing                                                         [字符串]
  -h, --help                  显示帮助                                                                                                                                 [布尔值]
  -v, --version               显示版本号                                                                                                                       [布尔值]
error 加载本地develop命令时出现问题，可能未安装Gatsby，建议执行"npm install"？


  Error: /root/static-website/node_modules/gatsby-cli/lib/reporter/loggers/ink/index.js:13111
    const lineNumber = location?.start.line;
                                ^
  SyntaxError: Unexpected token '.'

  - loader.js:915 wrapSafe
    internal/modules/cjs/loader.js:915:16

  - loader.js:963 Module._compile
    internal/modules/cjs/loader.js:963:27

  - loader.js:1027 Object.Module._extensions..js
    internal/modules/cjs/loader.js:1027:10

  - loader.js:863 Module.load
    internal/modules/cjs/loader.js:863:32

  - loader.js:708 Function.Module._load
    internal/modules/cjs/loader.js:708:14

  - loader.js:887 Module.require
    internal/modules/cjs/loader.js:887:19

  - helpers.js:74 require
    internal/modules/cjs/helpers.js:74:18

  - start-logger.js:41 startLogger
    [static-website]/[gatsby-cli]/lib/reporter/start-logger.js:41:5

  - index.js:15 Object.<anonymous>
    [static-website]/[gatsby-cli]/lib/reporter/index.js:15:30

  - loader.js:999 Module._compile
    internal/modules/cjs/loader.js:999:30

• 先后测试全局安装的gatsby-cli@2.5.0和gatsby-cli@5.2.0，问题复现：

root@app01:~/static-website# npm list -g --depth=0
/usr/local/lib
└── gatsby-cli@2.5.0

root@app01:~/static-website# npm list -g --depth=0
/usr/local/lib
└── gatsby-cli@5.2.0

解决方案 #

这个错误的核心原因是Node.js版本过低，不支持ES2020引入的可选链操作符?.。可选链语法需要Node.js 14.0.0及以上版本支持，你的环境中Node.js版本低于此要求。

解决步骤： #

1. 检查当前Node.js版本：

node -v

2. 升级Node.js到LTS版本：
   • 若使用nvm（Node版本管理器）：

     nvm install --lts
     nvm use --lts
     

   • 若为系统直接安装的Node.js，可通过对应系统的包管理器（如Ubuntu的apt、CentOS的yum）或官方安装包进行升级。
3. 升级完成后，进入项目目录重新安装依赖并启动服务：

cd ~/static-website
npm install
gatsby develop

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