Search code examples
reactjsserverless

React/ServerlessSyntaxError: Unexpected token '.' - if (options?.CAPACITY) {

For my serverless react program, the browser just says:

SyntaxError: Unexpected token '.'

Below is my Cloudwatch Log on AWS. If I make change to my program, and get an error like this, not in my code, what should be my approach to solving?

2023-01-21T21:56:10.862-06:00

Copy
2023-01-22T03:56:10.862Z    bcad1fe4-3046-4d00-a7c3-853024fd4cc1    ERROR   /var/task/630.js:80
    if (options?.CAPACITY) {
                ^

SyntaxError: Unexpected token '.'
    at wrapSafe (internal/modules/cjs/loader.js:915:16)
    at Module._compile (internal/modules/cjs/loader.js:963:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)
    at Module.load (internal/modules/cjs/loader.js:863:32)
    at Function.Module._load (internal/modules/cjs/loader.js:708:14)
    at Module.require (internal/modules/cjs/loader.js:887:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at Object.__webpack_require__.f.require (/var/task/webpack:/serverless-react-boilerplate/webpack/runtime/require chunk loading:29:1)
    at /var/task/webpack:/serverless-react-boilerplate/webpack/runtime/ensure chunk:6:1
    at Array.reduce (<anonymous>)
2023-01-22T03:56:10.862Z bcad1fe4-3046-4d00-a7c3-853024fd4cc1 ERROR /var/task/630.js:80 if (options?.CAPACITY) { ^ SyntaxError: Unexpected token '.' at wrapSafe (internal/modules/cjs/loader.js:915:16) at Module._compile (internal/modules/cjs/loader.js:963:27) at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10) at Module.load (internal/modules/cjs/loader.js:863:32) at Function.Module._load (internal/modules/cjs/loader.js:708:14) at Module.require (internal/modules/cjs/loader.js:887:19) at require (internal/modules/cjs/helpers.js:74:18) at Object.__webpack_require__.f.require (/var/task/webpack:/serverless-react-boilerplate/webpack/runtime/require chunk loading:29:1) at /var/task/webpack:/serverless-react-boilerplate/webpack/runtime/ensure chunk:6:1 at Array.reduce (<anonymous>)
Solution

  • This syntax options?.CAPACITY is called Optional chaining. It seems like your local setup supports it but the setup you have on AWS doesn't.

    You need to make sure you are using the right package versions that support optional chaining.

    For NodeJs, you need to use a version >=14.0.0 (Ref)

    For Webpack, you need to use a version >=5 (Ref)

    For Babel, you need to use a version >=7.8.0 (Ref)

    If you are using create-react-app, you need to use a version >=3.3.0 (Ref)