From 522dcdd33918aa3b51e46e554cfe447994924117 Mon Sep 17 00:00:00 2001
From: Nicholas Cunningham <ndcunningham@gmail.com>
Date: Tue, 9 Aug 2022 09:31:22 -0600
Subject: [PATCH] feat(nextjs): improve type checking for nextjs config file
 (#11497)

Co-authored-by: Nicholas Cunningham <ndcunningham>
---
 packages/next/plugins/with-less.ts                        | 3 ++-
 packages/next/plugins/with-nx.ts                          | 5 ++++-
 packages/next/plugins/with-stylus.ts                      | 3 ++-
 .../generators/application/files/next.config.js__tmpl__   | 8 +++++---
 4 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/packages/next/plugins/with-less.ts b/packages/next/plugins/with-less.ts
index 6ff84b895f..7651e320e8 100644
--- a/packages/next/plugins/with-less.ts
+++ b/packages/next/plugins/with-less.ts
@@ -12,7 +12,7 @@ function patchNextCSSWithLess(
 
 patchNextCSSWithLess();
 
-function withLess({ lessLoaderOptions = {}, ...nextConfig }) {
+export function withLess({ lessLoaderOptions = {}, ...nextConfig }) {
   return Object.assign({}, nextConfig, {
     webpack(config, opts) {
       // there are 2 relevant sass rules in next.js - css modules and global css
@@ -95,4 +95,5 @@ function withLess({ lessLoaderOptions = {}, ...nextConfig }) {
 }
 
 module.exports = withLess;
+module.exports.withLess = withLess;
 module.exports.patchNext = patchNextCSSWithLess;
diff --git a/packages/next/plugins/with-nx.ts b/packages/next/plugins/with-nx.ts
index a84cc76412..b514058a01 100644
--- a/packages/next/plugins/with-nx.ts
+++ b/packages/next/plugins/with-nx.ts
@@ -20,7 +20,7 @@ function regexEqual(x, y) {
   );
 }
 
-function withNx(nextConfig = {} as WithNxOptions) {
+export function withNx(nextConfig = {} as WithNxOptions) {
   const userWebpack = nextConfig.webpack || ((x) => x);
   const { nx, ...validNextConfig } = nextConfig;
   return {
@@ -154,4 +154,7 @@ function addNxEnvVariables(config: any) {
   }
 }
 
+// Support for older generated code: `const withNx = require('@nrwl/next/plugins/with-nx');`
 module.exports = withNx;
+// Support for newer generated code: `const { withNx } = require(...);`
+module.exports.withNx = withNx;
diff --git a/packages/next/plugins/with-stylus.ts b/packages/next/plugins/with-stylus.ts
index 71c6b001b8..f3a6bbd478 100644
--- a/packages/next/plugins/with-stylus.ts
+++ b/packages/next/plugins/with-stylus.ts
@@ -12,7 +12,7 @@ function patchNextCSSWithStylus(
 
 patchNextCSSWithStylus();
 
-function withStylus({ stylusLoaderOptions = {}, ...nextConfig }: any) {
+export function withStylus({ stylusLoaderOptions = {}, ...nextConfig }: any) {
   return Object.assign({}, nextConfig, {
     webpack(config, opts) {
       // there are 2 relevant sass rules in next.js - css modules and global css
@@ -94,4 +94,5 @@ function withStylus({ stylusLoaderOptions = {}, ...nextConfig }: any) {
 }
 
 module.exports = withStylus;
+module.exports.withStylus = withStylus;
 module.exports.patchNext = patchNextCSSWithStylus;
diff --git a/packages/next/src/generators/application/files/next.config.js__tmpl__ b/packages/next/src/generators/application/files/next.config.js__tmpl__
index b58403b991..fcc4650a98 100644
--- a/packages/next/src/generators/application/files/next.config.js__tmpl__
+++ b/packages/next/src/generators/application/files/next.config.js__tmpl__
@@ -1,10 +1,12 @@
+//@ts-check
+
 // eslint-disable-next-line @typescript-eslint/no-var-requires
-const withNx = require('@nrwl/next/plugins/with-nx');
+const { withNx } = require('@nrwl/next/plugins/with-nx');
 
 <% if (style === 'less') { %>
 // This plugin is needed until this PR is merged.
 // https://github.com/vercel/next.js/pull/23185
-const withLess = require('@nrwl/next/plugins/with-less');
+const { withLess } = require('@nrwl/next/plugins/with-less');
 
 /**
  * @type {import('@nrwl/next/plugins/with-nx').WithNxOptions}
@@ -19,7 +21,7 @@ const nextConfig = {
 
 module.exports = withLess(withNx(nextConfig));
 <% } else if (style === 'styl') { %>
-const withStylus = require('@nrwl/next/plugins/with-stylus');
+const { withStylus } = require('@nrwl/next/plugins/with-stylus');
 
 /**
  * @type {import('@nrwl/next/plugins/with-nx').WithNxOptions}