Skip to content
This repository was archived by the owner on May 10, 2021. It is now read-only.

Update netlify dev configuration recommendation #126

Closed
wants to merge 5 commits into from
Closed

Update netlify dev configuration recommendation #126

Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
9e72d3d
Update netlify dev configuration recommendation
garrypolley Dec 29, 2020
ec88978
Remove confusing wording from documentation
garrypolley Dec 29, 2020
fc4c3c5
Fix typo on you/your
garrypolley Dec 29, 2020
b678e70
Update with the `npx next-on-netlify` caveat
garrypolley Dec 31, 2020
5f5f213
show what is required for using netlify dev
garrypolley Jan 10, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 11 additions & 7 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -135,7 +135,7 @@ We're done. Let's deploy 🚀🚀🚀

I recommend you still use `next dev` to build and preview your application locally.

But if you want to emulate the Netlify deployment on your computer, you can also run `next-on-netlify` locally and then use `netlify-cli` to preview the result.
But if you want to emulate the Netlify deployment on your computer, you can also run `netlify-cli` to preview the result.

First, install the latest version of `netlify-cli` (you can also [look at package.json](https://github.com/netlify/next-on-netlify/blob/master/package.json) to see the version that next-on-netlify has been tested against):

Expand All @@ -154,10 +154,10 @@ Then, add the following `[dev]` block to your `netlify.toml`:
[dev]
functions = "out_functions"
publish = "out_publish"
# We manually set the framework to static, otherwise Netlify automatically
# detects Next.js and redirects do not work.
# Read more: https://github.com/netlify/cli/blob/master/docs/netlify-dev.md#project-detection
framework = "#static"
framework = "#custom" # necessary so netlify-dev allows the passthrough to your 3000 port
targetPort = 3000 # port your nextjs site is locally served from
port = 8888 # a nice port for your computer
command = "npm run dev" # The local next development command you use
```

Lastly, add the following lines to your `.gitignore`:
Expand All @@ -174,8 +174,12 @@ Now you're all set.

From now on, whenever you want to preview your application locally, just run:

1. `npm run build`: This will run `next build` to build your Next.js app and `next-on-netlify` to prepare your Next.js app for compatibility with Netlify
1. `netlify dev`: This will emulate Netlify on your computer and let you preview your app on `http://localhost:8888`.
1. `npm run build`: First build your site and get all the files ready
1. `netlify dev`: This will emulate Netlify on your computer and let you preview your app on `http://localhost:8888` (initially this will show 404 page).
1. Open another terminal window
1. `npx next-on-netlify`: This ensures assets are in working order your `http://localhost:8888` should hot reload and show your application
1. Now you can edit your application locally -- you'll need to repeat these steps if you update a function


*Note:*

Expand Down