Home > Enterprise >  Why do i get a optional chaining syntax error when my code is deployed but not locally if they are u
Why do i get a optional chaining syntax error when my code is deployed but not locally if they are u

Time:01-19

Recently I upgraded various packages (nextJS and Apollo) and so had to upgrade my version of node to 16.13.1 as required. I am using a github build workflow and specify the node version to be 16.13.1. When it is finished building it deploys but I get 500 errors when an api call tries to hit apollo. I suspect my apollo server is not building. When I look at the console logs I can see an error wrt to optional chaining which i suspect is stopping the apollo server from building properly hence causing the 500 runtime errors when it tries to be queried. Optional chaining should be working on this version of node and it does when running locally so why not when deployed?

Any debugging recommendations? I think pursuing the problem code below is a red herring fyi

Error copied from console:

2023-01-17T11:45:58.249754172Z /home/site/wwwroot/.next/server/pages/api/graphql.js:5515
2023-01-17T11:45:58.249791573Z   if (!response?.record) return null;
2023-01-17T11:45:58.249796773Z                 ^
2023-01-17T11:45:58.249800473Z
2023-01-17T11:45:58.249803973Z SyntaxError: Unexpected token '.'
2023-01-17T11:45:58.249807573Z     at wrapSafe (internal/modules/cjs/loader.js:915:16)
2023-01-17T11:45:58.249811173Z     at Module._compile (internal/modules/cjs/loader.js:963:27)
2023-01-17T11:45:58.249814773Z     at Object.Module._extensions..js (internal/modules/cjs/loader.js:1027:10)

Workflow file (only showing node and build steps)

on:
  push:
    branches:
      - test

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest

    steps:
      - uses: actions/checkout@master

      - uses: actions/cache@v1
        with:
          path: ${{ github.workspace }}/.next/cache
          key: ${{ runner.os }}-nextjs-${{ hashFiles('**/yarn.lock') }}

      - name: Set up Node.js version
        uses: actions/setup-node@main
        with:
          node-version: '16.13.1'

      - name: npm install, build, and test
        run: |
          npm install
          npm run build
          npm run lint:eslint
          npm run test:ci

tried altering the version of node and syntax. Used node-version '16', '14', '12.x', '16.x'. tried to use different actions/setup-node versions inc 'v1', 'v2' 'v3'. tried to build without the caching step (actions/cache@v1 with .....etc) - this actually results in an Internal Server Error failure when deployed and my wider nextjs app pages seem to fail as well. console logs seems to suggest issues with 'nullish coalescing operator' is the cause in this case.

CodePudding user response:

I found out that the container I am hosting my app within has a Target Framework configuration setting that is set to node 12. When I updated this to node 16 the build worked.

See post here for changing configuration in Azure App Service: Changing the target framework in an Azure web app

In summary the app was built successfully in node 16 and deployed to the app service as a node 16 app but whatever the container was doing it was doing it in node 12 and so complained about syntax that was not available in node 12 eg optional chaining and nullish coalescing.

I am not sure if this setup is only specific to Azure so hopefully this can help someone as at least a check to perform if you face a similar issue.

  • Related