Optional chaining operator gives SyntaxError when building my application to Heroku but works on my machine

I am using the optional chaining operator in my application, for instance:

object?.optionalField && this.doSomething(object.optionalField)

(checks if optionalField exists, then do something with it)

The above code works perfectly on my machine but it gives me an error when I try to build this code on Heroku. Here is what the logs say:

2020-08-06T06:39:09.697171+00:00 app[web.1]: > node app.js
2020-08-06T06:39:09.697171+00:00 app[web.1]: 
2020-08-06T06:39:09.760703+00:00 app[web.1]: (node:23) ExperimentalWarning: The ESM module loader is experimental.
2020-08-06T06:39:09.905459+00:00 app[web.1]: file:///app/domain/roots/User.js:49
2020-08-06T06:39:09.905462+00:00 app[web.1]:     changes?.biography && this.setBiography(changes.biography)
2020-08-06T06:39:09.905462+00:00 app[web.1]:             ^
2020-08-06T06:39:09.905463+00:00 app[web.1]: 
2020-08-06T06:39:09.905463+00:00 app[web.1]: SyntaxError: Unexpected token '.'
2020-08-06T06:39:09.905464+00:00 app[web.1]:     at Loader.moduleStrategy (internal/modules/esm/translators.js:122:18)
2020-08-06T06:39:09.915755+00:00 app[web.1]: npm ERR! code ELIFECYCLE
2020-08-06T06:39:09.917824+00:00 app[web.1]: npm ERR! errno 1
2020-08-06T06:39:09.920740+00:00 app[web.1]: npm ERR! ca-mongoose@1.0.0 start: `node app.js`
2020-08-06T06:39:09.920870+00:00 app[web.1]: npm ERR! Exit status 1
2020-08-06T06:39:09.920998+00:00 app[web.1]: npm ERR! 
2020-08-06T06:39:09.921159+00:00 app[web.1]: npm ERR! Failed at the ca-mongoose@1.0.0 start script.
2020-08-06T06:39:09.921732+00:00 app[web.1]: npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
2020-08-06T06:39:09.933019+00:00 app[web.1]: 
2020-08-06T06:39:09.933279+00:00 app[web.1]: npm ERR! A complete log of this run can be found in:
2020-08-06T06:39:09.933437+00:00 app[web.1]: npm ERR!     /app/.npm/_logs/2020-08-06T06_39_09_923Z-debug.log

Does anyone know why is that? I suspect I should compile the code first using Babel and then deploy to Heroku? Is it even related to Babel?

Answer

Does anyone know why is that?

Locally you’re using a recent version of Node.js that supports the optional chaining operator. Apparently Heroku is using an older version of Node.js that doesn’t. (Optional chaining is fairly new.)

I suspect I should compile the code first using Babel and then deploy to Heroku? Is it even related to Babel?

That’s one option. We can tell that the version Heroku is using is < v14 because of the “ExperimentalWarning: The ESM module loader is experimental.” According to this documentation that insivika pointed to, you can tell Heroku what version to use in the engines section of package.json, for instance:

{
  "engines": {
    "node": "14.x"
  }
}

That documentation says that the default is the current LTS version (as of this writing [07/Oct/2020], that’s v12.x).

Or if this is the only place you’re using optional chaining, you could use

object && object.optionalField && this.doSomething(object.optionalField);

or preferably

if (object && object.optionalField) {
    this.doSomething(object.optionalField);
}

😉