Theme Update - Bug Fix for Live Preview Issues

Hi Everyone -

On July 12th (yesterday) the npm package serve released version 14, which drops support for node 12. This update resulted in live previews running on node 12 no longer working.

We’ve updated the answers-hitchhiker-theme’s template repo to no longer have this issue, however repos that currently experience this issue will need to be manually updated.

Fix instructions:

  1. Open the ci/ file

  2. Change the second line, “npm install -g serve” to
    “npm install -g serve@13.0.4”

  3. Commit the change

  4. Terminate your session and reopen it

Please comment below if you are continuing to experience any issues!

If you’re still seeing issues, try this fix as well:


Hi! I am encountering the same issue with the live preview today. I followed the instructions as above but get the following error:

  • npm WARN config global --global, --local are deprecated. Use --location=global instead.
  • changed 93 packages, and audited 94 packages in 1s
  • 10 packages are looking for funding
  • run npm fund for details
  • found 0 vulnerabilities
  • npm ERR! code ERESOLVE
  • npm ERR! ERESOLVE could not resolve
  • npm ERR!
  • npm ERR! While resolving: grunt-webpack@4.0.2
  • npm ERR! Found: webpack@5.38.1
  • npm ERR! node_modules/webpack
  • npm ERR! dev webpack@“^5.37.1” from the root project
  • npm ERR! peer webpack@“>=2” from babel-loader@8.1.0
  • npm ERR! node_modules/babel-loader
  • npm ERR! dev babel-loader@“^8.1.0” from the root project
  • npm ERR! 9 more (css-loader, esbuild-loader, html-loader, …)
  • npm ERR!

Hi Amanda! I think you’re experiencing a separate issue. What’s the link to the Code Editor for this particular experience?

Hi Thomas! I’m not sure what happened but the live preview now works! I made an additional change to the “grunt-webpack” line from 4.0.0 to 4.0.3 in the package.json file and it seems like it refreshed after 10 min! Not sure if that fixed the issue but it was the only change I made since then.

Hi Amanda, that’s the right fix for your issue! Version 4.0.0 of grunt-webpack did not support Version 5 of Webpack, which is used in the Theme. That was the cause of the errors you saw. They created a patch Version (4.0.3) to allow grunt-webpack to work with Version 5 of Webpack.

1 Like

Hello! I have tried implementing all of the fixes (apply diff and the two above) and I am still not able to view my live preview. Could anyone assist? Thanks!

I tried to implement a fix for this but was given different directions from Engineering ticket which resulted in console errors for me. Since I had to commit the change I was wondering if there is a way to undo the commit so I can use this fix instead? I’m currently getting console errors and the live preview will not load as a result of changes to the package-lock.json file.

Hi @Carolyn_Gorick, it looks like your repo is experiencing this issue, could you give the fix a try? Fix Instructions for grunt-webpack 4.0.0 Live Preview Issues .

Hi @Sonia_Reardon

Were you able to resolve yours? If not, could you link your account here for Tom and Oliver?


Yes thanks for following up! Got this resolved with Oliver. Thanks!

Hi, I am getting an error after implementing this fix:

“Server application unavailable. To use live preview, please ensure you have configured a web server on port 8080 in your CI Config serve command. Please view the console logs for any errors establishing the web server.”

I checked my config file and 8080 is set in the CI Config. Can anyone advise an alternative solution to get this Live Preview working?

1 Like

Reposting the solution in case others run into something similar:
the issue is with your ci/ script. The script you have is:

npm install -g serve 
npx jambo build 
grunt webpack

You will need to remove the line npm install -g serve. I verified that this fixes the Preview issue. A specific version of serve needs to be installed for Preview to run (v13.0.4). The ci/ script already installs this specific version of serve. But, your ci/ was overriding this behavior and re-installing serve as the latest version, instead of v13.0.4.

1 Like

Hi all -

Still running into this issue despite having the exact file setup Caroline mentioned above -

Any fixes / proposed solutions?

Hi James,

Were you able to resolve yours? If not, could you link your account here for Tom and Oliver?


Has this bug been patched in a minor theme release?

I Know this is an old topic, but I’m experiencing the same issue and this fix doesn’t seem to be working. Here is my current setup. Any help is appreciated. file:

npm install -g serve@13.0.4
npm install file:

export NODE_OPTIONS="--max-old-space-size=1024"

#This will use development mode while in the Yext code editor. Set to "false" to test the production build.

serve -l 8080 desktop/ &
grunt watch file

export NODE_OPTIONS="--max-old-space-size=1024"
npx jambo build
grunt webpack

EDIT: Had to wait a bit and also restart the preview. It is working now.

1 Like