@nx/next 21.0.0-beta.10 → 21.0.0-beta.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nx/next",
-  "version": "21.0.0-beta.10",
+  "version": "21.0.0-beta.12",
   "private": false,
   "description": "The Next.js plugin for Nx contains executors and generators for managing Next.js applications and libraries within an Nx workspace. It provides:\n\n\n- Scaffolding for creating, building, serving, linting, and testing Next.js applications.\n\n- Integration with building, serving, and exporting a Next.js application.\n\n- Integration with React libraries within the workspace. \n\nWhen using Next.js in Nx, you get the out-of-the-box support for TypeScript, Playwright, Cypress, and Jest. No need to configure anything: watch mode, source maps, and typings just work.",
   "repository": {
@@ -35,7 +35,7 @@
     "next": ">=14.0.0"
   },
   "dependencies": {
-    "@nx/devkit": "21.0.0-beta.10",
+    "@nx/devkit": "21.0.0-beta.12",
     "@babel/plugin-proposal-decorators": "^7.22.7",
     "@svgr/webpack": "^8.1.0",
     "copy-webpack-plugin": "^10.2.4",
@@ -44,11 +44,11 @@
     "semver": "^7.5.3",
     "tslib": "^2.3.0",
     "webpack-merge": "^5.8.0",
-    "@nx/js": "21.0.0-beta.10",
-    "@nx/eslint": "21.0.0-beta.10",
-    "@nx/react": "21.0.0-beta.10",
-    "@nx/web": "21.0.0-beta.10",
-    "@nx/webpack": "21.0.0-beta.10",
+    "@nx/js": "21.0.0-beta.12",
+    "@nx/eslint": "21.0.0-beta.12",
+    "@nx/react": "21.0.0-beta.12",
+    "@nx/web": "21.0.0-beta.12",
+    "@nx/webpack": "21.0.0-beta.12",
     "@phenomnomnominal/tsquery": "~5.0.1"
   },
   "publishConfig": {

package/plugins/with-nx.d.ts

@@ -14,9 +14,8 @@ export interface SvgrOptions {
 export interface WithNxOptions extends NextConfig {
     nx?: {
         /**
-         * @deprecated Next.js via turbo conflicts with how webpack handles the import of SVGs.
-         * It is best to configure SVGR manually with the `@svgr/webpack` loader.
-         * We will remove this option in Nx 21.
+         * @deprecated Add SVGR support in your Webpack configuration without relying on Nx. See https://react-svgr.com/docs/webpack/
+         * TODO(v22): Remove this option and migrate userland webpack config to explicitly configure @svgr/webpack
          * */
         svgr?: boolean | SvgrOptions;
         babelUpwardRootMode?: boolean;

package/plugins/with-nx.js

@@ -241,26 +241,7 @@ function getNextConfig(nextConfig = {}, context = getWithNxContext()) {
                     ref: true,
                 };
                 const svgrOptions = typeof nx?.svgr === 'object' ? nx.svgr : defaultSvgrOptions;
-                // TODO(v21): Remove file-loader and use `?react` querystring to differentiate between asset and SVGR.
-                // It should be:
-                // use: [{
-                //   test: /\.svg$/i,
-                //   type: 'asset',
-                //   resourceQuery: /react/, // *.svg?react
-                // },
-                // {
-                //   test: /\.svg$/i,
-                //   issuer: /\.[jt]sx?$/,
-                //   resourceQuery: { not: [/react/] }, // exclude react component if *.svg?react
-                //   use: ['@svgr/webpack'],
-                // }],
-                // See:
-                // - SVGR: https://react-svgr.com/docs/webpack/#use-svgr-and-asset-svg-in-the-same-project
-                // - Vite: https://www.npmjs.com/package/vite-plugin-svgr
-                // - Rsbuild: https://github.com/web-infra-dev/rsbuild/pull/1783
-                // Note: We also need a migration for any projects that are using SVGR to convert
-                //       `import { ReactComponent as X } from './x.svg` to
-                //       `import X from './x.svg?react';
+                // TODO(v22): Remove SVGR support
                 config.module.rules.push({
                     test: /\.svg$/,
                     issuer: { not: /\.(css|scss|sass)$/ },

package/src/generators/application/files/common/next.config.js__tmpl__

@@ -12,11 +12,9 @@ const { withLess } = require('@nx/next/plugins/with-less');
  * @type {import('@nx/next/plugins/with-nx').WithNxOptions}
  **/
 const nextConfig = {
-  nx: {
-    // Set this to true if you would like to to use SVGR
-    // See: https://github.com/gregberge/svgr
-    svgr: false,
-  },
+  // Use this to set Nx-specific options
+  // See: https://nx.dev/recipes/next/next-config-setup
+  nx: {},
 };
 
 const plugins = [
@@ -36,11 +34,9 @@ module.exports = composePlugins(...plugins)(nextConfig);
  * @type {import('@nx/next/plugins/with-nx').WithNxOptions}
  **/
 const nextConfig = {
-  nx: {
-    // Set this to true if you would like to to use SVGR
-    // See: https://github.com/gregberge/svgr
-    svgr: false,
-  },
+  // Use this to set Nx-specific options
+  // See: https://nx.dev/recipes/next/next-config-setup
+  nx: {},
   <% if (style === 'styled-components') { %>
   compiler: {
     // For other options, see https://styled-components.com/docs/tooling#babel-plugin
@@ -66,11 +62,9 @@ module.exports = composePlugins(...plugins)(nextConfig);
  * @type {import('@nx/next/plugins/with-nx').WithNxOptions}
  **/
 const nextConfig = {
-  nx: {
-    // Set this to true if you would like to use SVGR
-    // See: https://github.com/gregberge/svgr
-    svgr: false,
-  },
+  // Use this to set Nx-specific options
+  // See: https://nx.dev/recipes/next/next-config-setup
+  nx: {},
 };
 
 const plugins = [

package/src/generators/application/lib/add-e2e.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.addE2e = addE2e;
 const devkit_1 = require("@nx/devkit");
 const e2e_web_server_info_utils_1 = require("@nx/devkit/src/generators/e2e-web-server-info-utils");
-const eslint_1 = require("@nx/eslint");
 const web_1 = require("@nx/web");
 const versions_1 = require("../../../utils/versions");
 async function addE2e(host, options) {
@@ -47,7 +46,7 @@ async function addE2e(host, options) {
         }
         const e2eTask = await configurationGenerator(host, {
             ...options,
-            linter: eslint_1.Linter.EsLint,
+            linter: 'eslint',
             project: options.e2eProjectName,
             directory: 'src',
             skipFormat: true,

package/src/generators/application/lib/add-linting.js

@@ -23,7 +23,7 @@ async function addLinting(host, options) {
         setParserOptionsProject: options.setParserOptionsProject,
         addPlugin: options.addPlugin,
     }));
-    if (options.linter === eslint_1.Linter.EsLint && (0, eslint_file_1.isEslintConfigSupported)(host)) {
+    if (options.linter === 'eslint' && (0, eslint_file_1.isEslintConfigSupported)(host)) {
         if ((0, flat_config_1.useFlatConfig)(host)) {
             (0, eslint_file_1.addPredefinedConfigToFlatLintConfig)(host, options.appProjectRoot, 'flat/react-typescript');
             // Since Next.js does not support flat configs yet, we need to use compat fixup.

package/src/generators/application/lib/normalize-options.js

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeOptions = normalizeOptions;
 const devkit_1 = require("@nx/devkit");
 const project_name_and_root_utils_1 = require("@nx/devkit/src/generators/project-name-and-root-utils");
-const eslint_1 = require("@nx/eslint");
 const assertion_1 = require("@nx/react/src/utils/assertion");
 const ts_solution_setup_1 = require("@nx/js/src/utils/typescript/ts-solution-setup");
 async function normalizeOptions(host, options) {
@@ -43,7 +42,7 @@ async function normalizeOptions(host, options) {
         e2eProjectRoot,
         e2eTestRunner: options.e2eTestRunner || 'playwright',
         fileName,
-        linter: options.linter || eslint_1.Linter.EsLint,
+        linter: options.linter || 'eslint',
         outputPath,
         parsedTags,
         projectName: appProjectName,