Propper way to handle csv's in nextjs + typescript

Question

I'm building a web app with nextjs & typescript. I have a chart which I want to display and would like to use a csv file for the data (let me know if using csv is a bad choice - I guess in the end I will probably add this data to my backend server so I can have it up to date and serve it from an api).

I saved the csv file mydata.csv in /public . Should I be using a library such as papaparse - if so how can I pass the file to the parser? There is also this solution which I found here How do I import a file with a space using next.js? but when I try: const dt = import('../../public/mydata.csv') I get the error "Cannot find module '../../public/mydata.csv' or its corresponding type declarations.ts(2307)"

Answer 1

The format import dt from '../../public/mydata.csv'; works just well for me when it's implemented along with the webpack solution you've linked to.

The issue could be that the IDE you're using doesn't understand next.config.js (mine doesn't and shows this error).

The app, however, builds and runs just fine, giving me parsed csv contents (without the need to use papaparse .