Stackblitz errors console incorrect line

Hi !

I just started using stackblitz and I’m having an odd thing happen.

When there is an error in my code, it throws the error in the console. However the line where it says that the error occurs is wrong. The longer my code gets, the worse it gets. I had an error on line 160 and it said it was on 117.

Not sure if this is common? But I can’t seem to find this issue online anywhere. Maybe I’m not using the correct terminology to find the answer.

It is likely because it is getting transpiled/bundled using something like Webpack, Babel, and the like. So the code that runs is different from the written code and the error is thrown in the code that runs, not the written code.

1 Like

Ahhh, that makes sense. Thank you.
Is there anything I can do on my end to make it easier to find the errors? Or am I kind of hooped?

It depends. What is it you are coding exactly?

Usually, I would say source maps but that might not be possible or depend on the code and runtime environment.

Well, I coded the Quote Generator in code pen, and then afterwards decided I wanted to transfer it to stackblitz (you recommended stackblitz and you were right, it’s better, much closer to an IRL editor and will benefit me later for sure)

Anyhoot, it was just my Quote Generator pasted into stackblitz, it does transpile it with babel.

So React?

What Stackblitz template are you using?

Edit: Try the Vite/React template if you are not using that one.

Sorry for not communicating properly, I’m still a big n00b.
Yes React.
I was using the JS template and then imported the necessary dependencies and whatnot. The only reason I did it that way instead of creating of using the React template was because I wanted to type the information out to solidify it better to memory, as I still don’t have a strong handle on importing api’s/libraries, because I’ve mainly only used the FCC in-browser editor where it was all loaded behind the scenes for us.

There’s a fork of what I did. Don’t mind the mess of code.

Pretty sure if you use the Vite/React template you will get the correct line number for the errors.

You can still add packages using the console (click the + on the terminal window to open a new one). But it does come with React pre-installed.

1 Like

Ok, thanks a lot for your help!

I’ll use the React Template going forward. Just wanted to start from scratch on a .js template to get some practice importing stuff and whatnot.

Anyhoot, thanks again!

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.