fix(next): fix withNx with nx property doesn't exist (#11900)

packages/next/plugins/with-nx.spec.ts

@@ -0,0 +1,51 @@
+import { withNx } from './with-nx';
+
+describe('withNx', () => {
+  describe('svgr', () => {
+    it('should be used by default', () => {
+      const config = withNx({});
+
+      const result = config.webpack(
+        {
+          module: { rules: [{ oneOf: [] }] },
+        },
+        {
+          defaultLoaders: {
+            babel: {
+              options: {},
+            },
+          },
+        }
+      );
+
+      expect(
+        result.module.rules.some((rule) => rule.test?.test('cat.svg'))
+      ).toBe(true);
+    });
+
+    it('should not be used when disabled', () => {
+      const config = withNx({
+        nx: {
+          svgr: false,
+        },
+      });
+
+      const result = config.webpack(
+        {
+          module: { rules: [{ oneOf: [] }] },
+        },
+        {
+          defaultLoaders: {
+            babel: {
+              options: {},
+            },
+          },
+        }
+      );
+
+      expect(
+        result.module.rules.some((rule) => rule.test?.test('cat.svg'))
+      ).toBe(false);
+    });
+  });
+});

packages/next/plugins/with-nx.ts

@@ -128,7 +128,7 @@ export function withNx(nextConfig = {} as WithNxOptions) {
        */
 
       // Default SVGR support to be on for projects.
-      if (nx.svgr !== false) {
+      if (nx?.svgr !== false) {
         config.module.rules.push({
           test: /\.svg$/,
           oneOf: [
@@ -180,7 +180,7 @@ function getNxEnvironmentVariables() {
 }
 
 function addNxEnvVariables(config: any) {
-  const maybeDefinePlugin = config.plugins.find((plugin) => {
+  const maybeDefinePlugin = config.plugins?.find((plugin) => {
     return plugin.definitions?.['process.env.NODE_ENV'];
   });