1.14.0 Syntax error exits server

[raskyer]

What version of Remix are you using?

1.14.0

Are all your remix dependencies & dev-dependencies using the same version?

• Yes

Steps to Reproduce

• Create a remix app with remix template
• Run web server
• After first successful load, make a typo error in the component

Expected Behavior

Server display a classical error within the root error boundary

Actual Behavior

Server crash with : Error: Build failed with 1 error

\node_modules\esbuild\lib\main.js:1591
  let error = new Error(`${text}${summary}`);

[raskyer]

[machour]

You seem to have a syntax error, that causes a build error.
CatchBoundary only catches exceptions thrown at runtime, not build errors.

Let me know if I misunderstood something 🙏🏼

[raskyer]

Hello @machour

The problem here is not the typo or the error in itself.

The issue is that this error shutdown the remix server.

On 1.13 I would have a big white and red error screen as expected.
But there, the server does not recover and I am forced to rerun : npm run dev.

Which is new with 1.14 and not very convenient.

[raskyer]

When I say Catch Boundary, it was a mistake, indeed it's the error boundary but it doesn't change the issue.

It reminds me a former issue with the new dev server where sometimes it crash with a filesystem error because it was trying to write on a file that was already busy.

Here the issue is different ofc, but the end result is the same :
The dev server crashs and I am forced to rerun it.

I precise that I don't have any catch or error boundary in my project. On 1.13 all the typo errors were catched correctly, but not on 1.14.

[machour]

Please provide a repository reproducing the issue 🙏🏼

[raskyer]

@machour, it's hard to do that because (as for the former bug I was mentionning) the typo error doesn't always shut the dev server.

It's "sometimes" and I am not sure how to reproduce it 100%.

My repo has nothing fancy though. A brand new remix version 1.14, in typescript, on Windows. No future activated and I am still on the former remix dev server from remix template (not the express one).

• Launch dev server
• Browse the page
• Made couple of valid changes on the component, save
• Made other change but with a typo, save
• If the dev server is still running, repeat.

In normal scenario of dev session, this error should happen regularly.

It seems like the root cause is that error spread from esbuild arn't caught properly.

[machour]

@raskyer You're absolutely right, this is a regression in DX.

Although before 1.14.0, the build would fail, and you would get the old build in the browser, not knowing it failed.
@pcattori was this change done on purpose, or is it a side effect of the new dev server code?

[zkdiff]

This is the minimal reproduction: https://github.com/zkdiff/minimal-reproduction-1.14-build-error-regression

Essentially:

1. Run npx create-remix@latest
2. Run npm run dev in the project dir
3. Insert a > before the opening div tag in index.tsx
4. Save the file and observe that the dev server exits with error

[michaeldebetaz]

I encounter the same problem. I tried reverting back to 1.13 (by changing every @remix dep manually), but the problem is still here.

Did I downgrade the remix version the wrong way or should I keep going lower?

EDIT: Thanks @kiliman (who answered below 👇)! I indeed forgot to remove the ^ before the version. It worked then with npm install. I confirm the issue is not present in 1.13 👍

[kiliman]

It depends on how your package.json versions look like.

If you've already upgraded to v1.14.0 and you're using "^1.14.0", then try to downgrade by using "^1.13.0", npm won't change the version because package-lock.json has v1.14.0 which satisfies "^1.13.0". You can either delete your package-lock.json (not recommended) or pin the version by removing the ^. This tells npm that you want that specific version only, so npm install should work as intended.

You can verify your versions by running npx rmx-cli version. It will list the current version installed.

[alexqhj]

Can confirm this, and it's a pretty bad DX regression.

npx create-remix@latest - npm run dev - Cause a JSX error - The server crashes and you'll need to run npm run dev again.

However, when using the indie stack, this doesn't happen.

1. npx create-remix@latest --template remix-run/indie-stack blog-tutorial
2. cd blog-tutorial && npm run dev
3. Cause a JSX error.
4. The server stays up, shows the error in console, and rebuilds when the error is fixed.

Using Node 19.6. Both projects using @latest (1.14.0)

[DonKoko]

I am a bit confused what is the proper way to handle this right now. Yes, I can lock my version to 1.13 but I am wondering if this will get patched as I can see 1.14 is released already. What do I need to do to make this work in 1.14.0?

[github-actions]

🤖 Hello there,

We just published version 1.14.3-pre.0 which involves this issue. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

[github-actions]

🤖 Hello there,

We just published version 1.14.3 which involves this issue. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!