Shopify主题异常：theme.js未捕获语法错误致AJAX购物车失效

Hey there, let’s figure out what’s going on here and get your AJAX cart back up and running.

First off, that code you’re seeing in theme.js? It’s Sass (SCSS) syntax, not JavaScript. Browsers can’t parse @function or those Sass-specific directives in a JS file, which is exactly why you’re getting that "Invalid or unexpected token" error—and why your AJAX cart stopped working. The kicker is you didn’t even edit theme.js, so this is almost certainly a compilation or caching glitch.

Why this might have happened #

• Theme update bug: Sometimes when Shopify themes push automatic updates, their asset compiler glitches out and dumps Sass code into the compiled theme.js file instead of the CSS files where it belongs.
• Cached broken assets: Shopify’s asset pipeline might have cached a messed-up version of theme.js even if your theme’s source files are totally fine.
• Third-party app conflict: A recently installed app could be interfering with the theme’s asset compilation process, causing this cross-contamination of code types.

Steps to fix it #

• Force a full browser refresh first
  Hit Ctrl + Shift + R (Windows) or Cmd + Shift + R (Mac) to bypass cached assets. This is a quick win if the issue is just a temporary cache blip.

• Trigger a recompile of your theme assets
  Head to your Shopify Admin → Online Store → Themes → Actions → Edit Code. Look for the Sass files (usually ending in .scss.liquid or .scss) that hold that em() function—check folders like helpers or functions. Make a tiny, harmless edit (like adding an extra space at the end of the file) and save it. This tells Shopify to recompile all assets correctly, overwriting the broken theme.js.

• Roll back to a working theme version
  If the problem started right after a theme update, go to Themes → Actions → Restore previous version. Pick a version from before your AJAX cart broke—this will revert theme.js to its correct state without the rogue Sass code.

• Check for app interference
  Disable any apps you installed recently one by one, clearing your browser cache after each disable. If the error disappears, you’ve found the culprit—reach out to the app’s developer for help fixing the conflict.

Temporary band-aid (if you need a quick fix) #

If you need the cart working immediately, you can manually delete the Sass code block from theme.js:

1. In the theme code editor, open theme.js.
2. Find the entire chunk starting with /*================ SASS HELPERS ================*/ and delete it.
3. Save the file and test the cart.

Just note this is a temporary fix—you’ll still want to resolve the root compilation issue so other theme functionality doesn’t break down the line.

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