The words Under construction in black text on a yellow background with diagonal black stipes surrounding it
I'm in the process of moving my site. It's still a work in progress. Please excuse the mess and broken links.

Fixing A Index Page Not Found Error On A NextJS Site On Netlify

TODO: Pull subtitle into page object

I setup a new Next.js site on Netlify that didn't quite work out of the box. When I did the deploy, I'd get "Page Not Found" on the home page. I'm not sure, but I think the reason is because I pointed Netlify at the GitHub repo before I pushed up the next.js code.

The things I needed to do for the fix were:

1. In the UI under "Site Settings - Build and Deploy - Continuous Deployment - Build Settings" set:

- Base directory: `/` - Build command: `npm run build` - Publish direcotry: `/.next`

2. Under "Plugins", install the "Essential Next.js" plugin for the site.

With those change the next push/deploy got things working as expected.

NOTE: I think it's also possible to install the plugin as a module directly in your development environment with this instead of installing the plugin from the UI:

code_start_default_section code_end_default_section

Debugging Stuff

I'm moving stuff around right now. All this below is helping me figure out where to put stuff

        -- title

Fixing A Index Page Not Found Error On A NextJS Site On Netlify

-- p

I setup a new Next.js site on Netlify that didn't quite work out of the box. When I did the deploy, I'd get "Page Not Found" on the home page. I'm not sure, but I think the reason is because I pointed Netlify at the GitHub repo before I pushed up the next.js code.

-- p

The things I needed to do for the fix were:

-- p

1. In the UI under "Site Settings - Build and Deploy - Continuous Deployment - Build Settings" set:

-- p

- Base directory: `/`
    - Build command: `npm run build`
    - Publish direcotry: `/.next`

-- p

2. Under "Plugins", install the "Essential Next.js" plugin for the site.

-- p

With those change the next push/deploy got things working as expected.

-- p

NOTE: I think it's also possible to install the plugin as a module directly in your development environment with this instead of installing the plugin from the UI:

-- code/
-- bash

npm install --save @netlify/plugin-nextjs

-- /code


-- categories
-- Miscellaneous

-- metadata
-- date: 2021-11-20 15:10:11
-- id: 21cjctle
-- status: draft
-- type: post
-- SCRUBBED_NEO: false
-- site: aws