I’m trying to import a csv using d3.csvParse, but for some reason it’s not loading my csv file.
Here’s my project structure:
<code>project/
- public/
- src/
- app/
- page.tsx
- data/
- us-counties.csv
</code>
<code>project/
- public/
- src/
- app/
- page.tsx
- data/
- us-counties.csv
</code>
project/
- public/
- src/
- app/
- page.tsx
- data/
- us-counties.csv
I’m using the latest version of Next.js (v14.2.5)
<code>// page.tsx
export default function Home() {
const data = d3.csvParse('/data/us-counties.csv');
console.log(data)
return (
// ...
)
}
</code>
<code>// page.tsx
export default function Home() {
const data = d3.csvParse('/data/us-counties.csv');
console.log(data)
return (
// ...
)
}
</code>
// page.tsx
export default function Home() {
const data = d3.csvParse('/data/us-counties.csv');
console.log(data)
return (
// ...
)
}
I’ve tried changing the csvParse command to src/data/us-counties.csv, but it didn’t work. I also tried moving it into the public folder, but it didn’t work either.
I’ve seen some people online say that to use a csv in React with D3.js you have to import csv, but when I try that I get an error
<code>import dataset from '../data/us-counties.csv'; // Cannot find module '../data/us-counties.csv' or its corresponding type declarations. ts(2307)
</code>
<code>import dataset from '../data/us-counties.csv'; // Cannot find module '../data/us-counties.csv' or its corresponding type declarations. ts(2307)
</code>
import dataset from '../data/us-counties.csv'; // Cannot find module '../data/us-counties.csv' or its corresponding type declarations. ts(2307)
Any ideas on how to fix this?