Error page centre issue

[ritz078]

In the error page, things are not properly aligned.

[agent515]

Would like to pick up this issue.

[ritz078]

@agent515 assigned this to you.

[agent515]

@ritz078 To check the layout of Erro 500, I inserted this check status === 500 and found the layout to be fine. But got error is shown in the following image. I am guessing it is related to updating webpack, do you want me to test this or even recreate the error in any different way?

[ritz078]

This isn't webpack. The webpack prefix is there because it was used to build it.

You should check the CSS on production and compare it with what you get locally. This will help you narrow down the exact location of error.

[agent515]

If I compare just CSS files, I don't find anything wrong there. But noticed that instead of is loading in the production even though the status code is 404. And as I researched to find where exactly _error.tsx file is used, came across _error.js file. As I have not used webpack before, I am not exactly sure how to go about resolving the error. I now have started to learn webpack. Is that the right way to go?

[ritz078]

In

transform/pages/_error.tsx

Line 11 in 707f15f

{statusCode === 404 ? (

replace statusCode === 404 with false and open a route that does not exist.

for eg: http://localhost:3000/a

[agent515]

In

transform/pages/_error.tsx

Line 11 in 707f15f

{statusCode === 404 ? (

replace statusCode === 404 with false and open a route that does not exist.

for eg: http://localhost:3000/a

I already did that and it worked fine (in the center) as shown in the snapshot shared before. And, I could not find the alignment error that is shown in the snapshot shared by you.

And about what I said in the previous comment was that on the production https://transform.tools/a shows Error500 component. I thought that itself should be a bug and traced it to _error.js static file but as I am not familiar with webpack I thought I should start learning about it to understand build.