Importing a generic const array is generating null pointer on build, but no compile error.

Heya folks! I'm working on a little web application that generates bingo cards and allows you to customize them as you wish. In my professional work I have to use JS, and StyledComponents (alhtough I am whittling them down), so I was really excited to jump into a personal project that has type safe technologies. As such, I thought the best thing to do was to use "create-t3-app" and mess around in it. I've spent the day developing and HOT DAMN is this stuff great, but now I ran into a bizarre "bug" (see the images). I have a const in a separate file that has a static array of a custom object type. What I want to do is import it, and use it as the default value for my state on first run. I write the code as seen in the pics, and get no type errors. So far so good. But for whatever reason, when I'm building the solution, the "genericLoremIpsumPool" array comes as a null, and throws a null pointer. And, bizarrely, if instead of importing the const from another file, I simply declare it locally (outiside of the component scope, just below the imports), it runs no problem. I know Im making some kind of dumb mistake here, but I need help spotting it. Any clues? PS: Yes, I know, I should probably use React Query for my state management, but bear with me here, ok?

Solution:

It should work. Honestly, I would start by restarting ts server in vscode or restarting vscode itself 🙂 do you get the same if you use shorthand syntax for typing arrays? export const blah: BingoElement[] = …

Jump to solution