CODEWITHSUNDEEP
next.js
financial_physician
financial_physician

Reputation: 1978

Static pages that are dynamically generated in Next JS

Let's start with the relevant file structure

pages
  |---[state]
  |      |----[city].tsx
  |---[state].tsx

My goal is to both dynamically render pages at the location /[state] as well as at the location /[state]/[city]

When I run the build, /[state] is generated as expected but when it goes to build [state]/city it fails because /[state]/ is now a dynamically assigned directory like NorthCarolina/Charlotte or Florida/Orlando and the error thrown is

Error occured prerendering page "/NorthCarolina/Charlotte"... ENOTDIR: not a directory, open 'NorthCarolina/Charlotte'

So while the errors seem kinda reasonable, I'm trying to figure out how I'm supposed to generate all these pages I want dynamically.

I tried a hack solution like adding a folder called NorthCarolina to see if that'd fix it but no luck.

Figured out that it has to do with how I'm writing to a file in getStaticPaths and reading from the written files in getstaticProps. Still messing around with it but the problem isn't related to a next.js feature.

Upvotes: 1

Views: 1413

Answers (1)

financial_physician
financial_physician

Reputation: 1978

Here's an answer for posterity.

The problem was that when I was using fs.writeFile in getStaticPaths I was writing to /tmp/Florida/Tampa which doesn't exist. What is valid is writing to /tmp/FloridaTampa.

Coding can be painful.

Upvotes: 1

Related Questions