Invalid Unicode escape sequence from _buildManifest.js

[flybayer]

Bug report

Describe the bug

Roughly 5-10% of the time when starting the Next.js dev server in Blitz.js results in the below error in the browser immediately after first page load. This error shows in the dev error overlay and in the browser console.

SyntaxError: Invalid Unicode escape sequence        _buildManifest.js:1

Before 9.5.3, it would show as something like s is undefined.

Note: we do have concurrent mode enabled, so possibly it could have something to do with that?

To Reproduce

I'm unable to reliably reproduce, but here's how it happens:

1. npx blitz new testapp
2. cd testapp
3. yarn blitz start
4. Immediately click the localhost:3000 link as soon as it appears from the Next.js dev server
5. Repeat steps 3 & 4 until you see the error

Expected behavior

Should not error

System information

System:
OS: macOS 10.15.6
CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
Memory: 614.28 MB / 64.00 GB
Shell: 3.1.2 - /usr/local/bin/fish
Next.js: 9.5.3

[ShikChen]

Just hit this today. The HTTP response looks truncated with unclosed JSON. Is there any update?

[flybayer]

@ShikChen did you encounter this in a blitz project or regular next.js?

[ShikChen]

It's a blitz project.

[MisterJimson]

I just started seeing this when updating from node 16.6.2 to 16.13.0, no other changes.

[amirho1]

@flybayer I don't think it's because of blitz.js. it happened to me in a regular project (version=12.0.4)
did you find the reason and solution also I encounter it in development I didn't test it on production

[ppedziwiatr]

So we're struggling with this in our current project.
It's just a test project that adds our library as a dependency and verifies if next.js works.

All other bundlers that we're testing (webpack 4/5, vite, rollup, parcel) work without any issue.

it builds (i.e. next build)
it runs in dev mode (i.e. next dev).

It does not run in prod mode (i.e. next start):

I've verified and \u does not come from either our library code, nor from any of the deps that are in the node_modules..

What is going on here?

EDIT: I've made some more investigation...

The original code in one of the library in the node_modules contains sth like \\n - in a "nested template" string:
${r.slice(t,n)}${`\\u${i.toString(16)}`}

The code in the bundle that next.js generates is broken for this part - i.e. it is converted into \n

If we bundle our library with a tool like esbuild - it handles it properly (i.e. \\n):

There's clearly something wrong with next.js bundling...

EDIT 2: we've also tried to use the above esbuild bundle in the next.js directly...
i.e. instead of importing our lib in next.js like this:
import {defaultCacheOptions, WarpFactory} from 'warp-contracts';

do
import {defaultCacheOptions, WarpFactory} from 'warp-contracts/web';

Our package.json has exports.web configured to point into the esbuild web bundle.

but it seems that we've hit this #31518 (comment)

This is madness :-)

EDIT 3 It seems that this double nested template string is generated by the bundlers - from sth. like plain string concatenation - so it's really hard to say which library exactly is the source of the issue (but again - it's not the library that is the issue - it's the bundler).

And as I've mentioned - the esbuild(and other bundlers) handles this properly.

We're using next.js 12.2.5, with this (I guest default?) config:

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  swcMinify: true,
}

module.exports = nextConfig

EDIT 4 Switching swcMinify to false fixes the issue.

[github-actions]

This closed issue has been automatically locked because it had no new activity for a month. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.