From 0fe8764a5d819c1798f184b973310b0c06d324ad Mon Sep 17 00:00:00 2001
From: Andrew Gerard <63810935+agerard-godaddy@users.noreply.github.com>
Date: Fri, 6 Dec 2024 12:08:41 -0700
Subject: [PATCH] docs: next.config.js (#987)

---
 docs/upgrade-to-7.md                    | 11 ++++++
 packages/gasket-plugin-nextjs/README.md | 52 +++++++++++--------------
 2 files changed, 34 insertions(+), 29 deletions(-)

diff --git a/docs/upgrade-to-7.md b/docs/upgrade-to-7.md
index 1bc878f72..908e95033 100644
--- a/docs/upgrade-to-7.md
+++ b/docs/upgrade-to-7.md
@@ -188,6 +188,17 @@ of Next.js.
 You can reference the [Next.js 14] and [Next.js 13] Upgrade Guides as needed
 for more details.
 
+In order for Next.js configurations from plugins or `nextConfig` in the 
+`gasket.js` file to be picked up, you will need to create a `next.config.js`
+file in the root of your project and export the results of the 
+`getNextConfig` GasketAction.
+
+```js
+// next.config.js
+import gasket from './gasket.js';
+export default gasket.actions.getNextConfig();
+````
+
 ## Switch to GasketActions
 
 Using the `req` and `res` objects for adding attachments and accessing data has
diff --git a/packages/gasket-plugin-nextjs/README.md b/packages/gasket-plugin-nextjs/README.md
index c9f6a8dbf..b0abcf988 100644
--- a/packages/gasket-plugin-nextjs/README.md
+++ b/packages/gasket-plugin-nextjs/README.md
@@ -22,32 +22,20 @@ export default makeGasket({
 });
 ```
 
-## Adding a Sitemap
-
-When creating a new application with this plugin, you will be prompted with a question in the CLI asking if you would like to add a [sitemap] to your application.
-
-Answering yes to this question will install `next-sitemap` as a dependency, generate a next-sitemap.config.js file, and add a `sitemap` npm script to your package.json. `next-sitemap` is an npm package that generates sitemaps and a robots.txt file for Next.js applications. Learn more by reading the [next-sitemap docs].
-
 ## Configuration
 
-- Instead of adding a dedicated `next.config.js`, the `nextConfig` property
-  within `gasket.js` is used. Everything you can configure in the
-  [next.config] can be added here.
-
 It is also possible for apps to config Next.js using the `gasket.js`
 file. To do so, specify a `nextConfig` object property in the same form as what
 you would set for [custom configurations][next.config] or using Next.js plugins.
 
-For general Webpack configurations, it is recommend to utilize features of the
-Gasket [webpack plugin].
-
-#### Example configuration
+#### Example Gasket configuration
 
 ```js
+// gasket.js
 export default makeGasket({
   plugins: [
     pluginNextjs
-  ]
+  ],
   nextConfig: {
     poweredByHeader: false,
     useFileSystemPublicRoutes: false
@@ -55,24 +43,19 @@ export default makeGasket({
 });
 ```
 
-#### Example with plugins
+In order for Next.js to pick up the configurations, you will need to create a
+`next.config.js` file in the root of your project and export the results of the
+[getNextConfig] action.
 
 ```js
-import withSass from '@zeit/next-sass';
-import withCss from '@zeit/next-css';
-
-export default makeGasket({
-  plugins: [
-    pluginNextjs
-  ]
-  nextConfig: withCss(
-    withSass({
-      /* config options here */
-    })
-  )
-});
+// next.config.js
+import gasket from './gasket.js';
+export default gasket.actions.getNextConfig();
 ```
 
+For general Webpack configurations, it is recommended to use features of the
+Gasket [Webpack plugin], which will be merged into the Next.js configuration.
+
 ### Internationalized Routing
 
 When using this plugin along with [@gasket/plugin-intl] to determine and provide
@@ -115,6 +98,16 @@ Also note when using [@gasket/plugin-intl] to determine the locale, that the
 `NEXT_LOCALE` cookie will have no effect. You can, of course, hook the [intlLocale]
 lifecycle in an app to enable that behavior if desired.
 
+## Adding a Sitemap
+
+When creating a new application with this plugin, you will be prompted with a
+question in the CLI asking if you would like to add a [sitemap] to your application.
+
+Answering yes to this question will install `next-sitemap` as a dependency,
+generate a next-sitemap.config.js file, and add a `sitemap` npm script to your
+package.json. `next-sitemap` is an npm package that generates sitemaps and a
+robots.txt file for Next.js applications. Learn more by reading the [next-sitemap docs].
+
 ## Actions
 
 ### getNextConfig
@@ -281,6 +274,7 @@ export default {
 <!--[next.config]-->
 
 [nextconfig lifecycle]: #nextconfig
+[getNextConfig]: #getnextconfig
 [@gasket/plugin-intl]: /packages/gasket-plugin-intl/README.md
 [intllocale]: /packages/gasket-plugin-intl/README.md#intllocale
 [webpack plugin]: /packages/gasket-plugin-webpack/README.md