@nx/next 16.8.0-beta.4 → 16.8.0-beta.6

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

@@ -49,6 +49,8 @@ function addProject(host, options) {
         targets,
         tags: options.parsedTags,
     };
-    (0, devkit_1.addProjectConfiguration)(host, options.projectName, Object.assign({}, project));
+    (0, devkit_1.addProjectConfiguration)(host, options.projectName, {
+        ...project,
+    });
 }
 exports.addProject = addProject;

package/src/generators/application/lib/create-application-files.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createApplicationFiles = void 0;
-const tslib_1 = require("tslib");
 const path_1 = require("path");
 const devkit_1 = require("@nx/devkit");
 const js_1 = require("@nx/js");
@@ -10,11 +9,22 @@ function createApplicationFiles(host, options) {
     const offsetFromRoot = (0, devkit_1.offsetFromRoot)(options.appProjectRoot);
     const layoutTypeSrcPath = (0, devkit_1.joinPathFragments)(offsetFromRoot, options.appProjectRoot, '.next/types/**/*.ts');
     const layoutTypeDistPath = (0, devkit_1.joinPathFragments)(offsetFromRoot, options.outputPath, '.next/types/**/*.ts');
-    const templateVariables = Object.assign(Object.assign(Object.assign({}, (0, devkit_1.names)(options.name)), options), { dot: '.', tmpl: '', offsetFromRoot,
+    const templateVariables = {
+        ...(0, devkit_1.names)(options.name),
+        ...options,
+        dot: '.',
+        tmpl: '',
+        offsetFromRoot,
         layoutTypeSrcPath,
-        layoutTypeDistPath, rootTsConfigPath: (0, js_1.getRelativePathToRootTsConfig)(host, options.appProjectRoot), appContent: (0, create_application_files_helpers_1.createAppJsx)(options.projectName), styleContent: (0, create_application_files_helpers_1.createStyleRules)(), pageStyleContent: `.page {}`, stylesExt: options.style === 'less' || options.style === 'styl'
+        layoutTypeDistPath,
+        rootTsConfigPath: (0, js_1.getRelativePathToRootTsConfig)(host, options.appProjectRoot),
+        appContent: (0, create_application_files_helpers_1.createAppJsx)(options.projectName),
+        styleContent: (0, create_application_files_helpers_1.createStyleRules)(),
+        pageStyleContent: `.page {}`,
+        stylesExt: options.style === 'less' || options.style === 'styl'
             ? options.style
-            : 'css' });
+            : 'css',
+    };
     (0, devkit_1.generateFiles)(host, (0, path_1.join)(__dirname, '../files/common'), options.appProjectRoot, templateVariables);
     if (options.appDir) {
         (0, devkit_1.generateFiles)(host, (0, path_1.join)(__dirname, '../files/app'), (0, path_1.join)(options.appProjectRoot, 'app'), templateVariables);
@@ -36,23 +46,31 @@ function createApplicationFiles(host, options) {
     if (options.rootProject) {
         (0, devkit_1.updateJson)(host, 'tsconfig.base.json', (json) => {
             const appJSON = (0, devkit_1.readJson)(host, 'tsconfig.json');
-            let { extends: _ } = json, updatedJson = tslib_1.__rest(json, ["extends"]);
+            let { extends: _, ...updatedJson } = json;
             // Don't generate the `paths` object or else workspace libs will not work later.
             // It'll be generated as needed when a lib is first added.
             delete json.compilerOptions.paths;
-            updatedJson = Object.assign(Object.assign({}, devkit_1.updateJson), { compilerOptions: Object.assign(Object.assign({}, updatedJson.compilerOptions), appJSON.compilerOptions), include: [
+            updatedJson = {
+                ...devkit_1.updateJson,
+                compilerOptions: {
+                    ...updatedJson.compilerOptions,
+                    ...appJSON.compilerOptions,
+                },
+                include: [
                     ...new Set([
                         ...(updatedJson.include || []),
                         ...(appJSON.include || []),
                     ]),
-                ], exclude: [
+                ],
+                exclude: [
                     ...new Set([
                         ...(updatedJson.exclude || []),
                         ...(appJSON.exclude || []),
                         '**e2e/**/*',
                         `dist/${options.projectName}/**/*`,
                     ]),
-                ] });
+                ],
+            };
             return updatedJson;
         });
         host.delete('tsconfig.json');

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

@@ -1,43 +1,50 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeOptions = void 0;
-const tslib_1 = require("tslib");
 const devkit_1 = require("@nx/devkit");
 const project_name_and_root_utils_1 = require("@nx/devkit/src/generators/project-name-and-root-utils");
 const linter_1 = require("@nx/linter");
 const assertion_1 = require("@nx/react/src/utils/assertion");
-function normalizeOptions(host, options) {
-    var _a;
-    return tslib_1.__awaiter(this, void 0, void 0, function* () {
-        const { projectName: appProjectName, projectRoot: appProjectRoot, projectNameAndRootFormat, } = yield (0, project_name_and_root_utils_1.determineProjectNameAndRootOptions)(host, {
-            name: options.name,
-            projectType: 'application',
-            directory: options.directory,
-            projectNameAndRootFormat: options.projectNameAndRootFormat,
-            rootProject: options.rootProject,
-            callingGenerator: '@nx/next:application',
-        });
-        options.rootProject = appProjectRoot === '.';
-        options.projectNameAndRootFormat = projectNameAndRootFormat;
-        const e2eProjectName = options.rootProject ? 'e2e' : `${appProjectName}-e2e`;
-        const e2eProjectRoot = options.rootProject ? 'e2e' : `${appProjectRoot}-e2e`;
-        const name = (0, devkit_1.names)(options.name).fileName;
-        const outputPath = (0, devkit_1.joinPathFragments)('dist', appProjectRoot, ...(options.rootProject ? [name] : []));
-        const parsedTags = options.tags
-            ? options.tags.split(',').map((s) => s.trim())
-            : [];
-        const fileName = 'index';
-        const appDir = (_a = options.appDir) !== null && _a !== void 0 ? _a : true;
-        const styledModule = /^(css|scss|less|styl)$/.test(options.style)
-            ? null
-            : options.style;
-        (0, assertion_1.assertValidStyle)(options.style);
-        return Object.assign(Object.assign({}, options), { appDir,
-            appProjectRoot,
-            e2eProjectName,
-            e2eProjectRoot, e2eTestRunner: options.e2eTestRunner || 'cypress', fileName, linter: options.linter || linter_1.Linter.EsLint, name,
-            outputPath,
-            parsedTags, projectName: appProjectName, style: options.style || 'css', styledModule, unitTestRunner: options.unitTestRunner || 'jest' });
+async function normalizeOptions(host, options) {
+    const { projectName: appProjectName, projectRoot: appProjectRoot, projectNameAndRootFormat, } = await (0, project_name_and_root_utils_1.determineProjectNameAndRootOptions)(host, {
+        name: options.name,
+        projectType: 'application',
+        directory: options.directory,
+        projectNameAndRootFormat: options.projectNameAndRootFormat,
+        rootProject: options.rootProject,
+        callingGenerator: '@nx/next:application',
     });
+    options.rootProject = appProjectRoot === '.';
+    options.projectNameAndRootFormat = projectNameAndRootFormat;
+    const e2eProjectName = options.rootProject ? 'e2e' : `${appProjectName}-e2e`;
+    const e2eProjectRoot = options.rootProject ? 'e2e' : `${appProjectRoot}-e2e`;
+    const name = (0, devkit_1.names)(options.name).fileName;
+    const outputPath = (0, devkit_1.joinPathFragments)('dist', appProjectRoot, ...(options.rootProject ? [name] : []));
+    const parsedTags = options.tags
+        ? options.tags.split(',').map((s) => s.trim())
+        : [];
+    const fileName = 'index';
+    const appDir = options.appDir ?? true;
+    const styledModule = /^(css|scss|less|styl)$/.test(options.style)
+        ? null
+        : options.style;
+    (0, assertion_1.assertValidStyle)(options.style);
+    return {
+        ...options,
+        appDir,
+        appProjectRoot,
+        e2eProjectName,
+        e2eProjectRoot,
+        e2eTestRunner: options.e2eTestRunner || 'cypress',
+        fileName,
+        linter: options.linter || linter_1.Linter.EsLint,
+        name,
+        outputPath,
+        parsedTags,
+        projectName: appProjectName,
+        style: options.style || 'css',
+        styledModule,
+        unitTestRunner: options.unitTestRunner || 'jest',
+    };
 }
 exports.normalizeOptions = normalizeOptions;

package/src/generators/application/lib/set-defaults.js

@@ -3,14 +3,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.setDefaults = void 0;
 const devkit_1 = require("@nx/devkit");
 function setDefaults(host, options) {
-    var _a, _b, _c, _d, _e;
-    var _f, _g, _h, _j;
     const nxJson = (0, devkit_1.readNxJson)(host);
-    (_a = nxJson.generators) !== null && _a !== void 0 ? _a : (nxJson.generators = {});
-    (_b = (_f = nxJson.generators)['@nx/next']) !== null && _b !== void 0 ? _b : (_f['@nx/next'] = {});
-    (_c = (_g = nxJson.generators['@nx/next']).application) !== null && _c !== void 0 ? _c : (_g.application = {});
-    (_d = (_h = nxJson.generators['@nx/next'].application).style) !== null && _d !== void 0 ? _d : (_h.style = options.style);
-    (_e = (_j = nxJson.generators['@nx/next'].application).linter) !== null && _e !== void 0 ? _e : (_j.linter = options.linter);
+    nxJson.generators ??= {};
+    nxJson.generators['@nx/next'] ??= {};
+    nxJson.generators['@nx/next'].application ??= {};
+    nxJson.generators['@nx/next'].application.style ??= options.style;
+    nxJson.generators['@nx/next'].application.linter ??= options.linter;
     (0, devkit_1.updateNxJson)(host, nxJson);
 }
 exports.setDefaults = setDefaults;

package/src/generators/application/lib/update-cypress-tsconfig.js

@@ -7,7 +7,10 @@ function updateCypressTsConfig(host, options) {
         return;
     }
     (0, devkit_1.updateJson)(host, `${options.e2eProjectRoot}/tsconfig.json`, (json) => {
-        return Object.assign(Object.assign({}, json), { exclude: [] });
+        return {
+            ...json,
+            exclude: [],
+        };
     });
 }
 exports.updateCypressTsConfig = updateCypressTsConfig;

package/src/generators/component/component.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.componentSchematic = exports.componentGenerator = void 0;
-const tslib_1 = require("tslib");
 const devkit_1 = require("@nx/devkit");
 const react_1 = require("@nx/react");
 const styles_1 = require("../../utils/styles");
@@ -18,19 +17,23 @@ function getDirectory(host, options) {
  * This schematic is basically the React one, but for Next we need
  * extra dependencies for css, sass, less, styl style options.
  */
-function componentGenerator(host, options) {
-    return tslib_1.__awaiter(this, void 0, void 0, function* () {
-        const project = (0, devkit_1.readProjectConfiguration)(host, options.project);
-        const componentInstall = yield (0, react_1.componentGenerator)(host, Object.assign(Object.assign({}, options), { directory: getDirectory(host, options), classComponent: false, routing: false, skipFormat: true }));
-        const styledInstall = (0, styles_1.addStyleDependencies)(host, {
-            style: options.style,
-            swc: !host.exists((0, devkit_1.joinPathFragments)(project.root, '.babelrc')),
-        });
-        if (!options.skipFormat) {
-            yield (0, devkit_1.formatFiles)(host);
-        }
-        return (0, devkit_1.runTasksInSerial)(styledInstall, componentInstall);
+async function componentGenerator(host, options) {
+    const project = (0, devkit_1.readProjectConfiguration)(host, options.project);
+    const componentInstall = await (0, react_1.componentGenerator)(host, {
+        ...options,
+        directory: getDirectory(host, options),
+        classComponent: false,
+        routing: false,
+        skipFormat: true,
     });
+    const styledInstall = (0, styles_1.addStyleDependencies)(host, {
+        style: options.style,
+        swc: !host.exists((0, devkit_1.joinPathFragments)(project.root, '.babelrc')),
+    });
+    if (!options.skipFormat) {
+        await (0, devkit_1.formatFiles)(host);
+    }
+    return (0, devkit_1.runTasksInSerial)(styledInstall, componentInstall);
 }
 exports.componentGenerator = componentGenerator;
 exports.default = componentGenerator;

package/src/generators/custom-server/custom-server.js

@@ -1,79 +1,80 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.customServerSchematic = exports.customServerGenerator = void 0;
-const tslib_1 = require("tslib");
 const devkit_1 = require("@nx/devkit");
 const path_1 = require("path");
-function customServerGenerator(host, options) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
-    return tslib_1.__awaiter(this, void 0, void 0, function* () {
-        const project = (0, devkit_1.readProjectConfiguration)(host, options.project);
-        if (((_b = (_a = project.targets) === null || _a === void 0 ? void 0 : _a.build) === null || _b === void 0 ? void 0 : _b.executor) !== '@nx/next:build' &&
-            ((_d = (_c = project.targets) === null || _c === void 0 ? void 0 : _c.build) === null || _d === void 0 ? void 0 : _d.executor) !== '@nrwl/next:build') {
-            devkit_1.logger.error(`Project ${options.project} is not a Next.js project. Did you generate it with "nx g @nx/next:app"?`);
-            return;
-        }
-        const outputPath = (_g = (_f = (_e = project.targets) === null || _e === void 0 ? void 0 : _e.build) === null || _f === void 0 ? void 0 : _f.options) === null || _g === void 0 ? void 0 : _g.outputPath;
-        const root = project.root;
-        if (!root ||
-            !outputPath ||
-            !((_k = (_j = (_h = project.targets) === null || _h === void 0 ? void 0 : _h.build) === null || _j === void 0 ? void 0 : _j.configurations) === null || _k === void 0 ? void 0 : _k.development) ||
-            !((_o = (_m = (_l = project.targets) === null || _l === void 0 ? void 0 : _l.build) === null || _m === void 0 ? void 0 : _m.configurations) === null || _o === void 0 ? void 0 : _o.production)) {
-            devkit_1.logger.error(`Project ${options.project} has invalid config. Did you generate it with "nx g @nx/next:app"?`);
-            return;
-        }
-        if (((_p = project.targets) === null || _p === void 0 ? void 0 : _p['build-custom-server']) ||
-            ((_q = project.targets) === null || _q === void 0 ? void 0 : _q['serve-custom-server'])) {
-            devkit_1.logger.warn(`Project ${options.project} has custom server targets already: build-custom-server, serve-custom-server. Remove these targets from project and try again.`);
-            return;
-        }
-        (0, devkit_1.generateFiles)(host, (0, path_1.join)(__dirname, 'files'), project.root, Object.assign(Object.assign({}, options), { offsetFromRoot: (0, devkit_1.offsetFromRoot)(project.root), projectRoot: project.root, tmpl: '' }));
-        project.targets.build.dependsOn = ['build-custom-server'];
-        project.targets.serve.options.customServerTarget = `${options.project}:serve-custom-server`;
-        project.targets.serve.configurations.development.customServerTarget = `${options.project}:serve-custom-server:development`;
-        project.targets.serve.configurations.production.customServerTarget = `${options.project}:serve-custom-server:production`;
-        project.targets['build-custom-server'] = {
-            executor: '@nx/js:tsc',
-            defaultConfiguration: 'production',
-            options: {
-                outputPath,
-                main: `${root}/server/main.ts`,
-                tsConfig: `${root}/tsconfig.server.json`,
-                clean: false,
-                assets: [],
-            },
-            configurations: {
-                development: {},
-                production: {},
-            },
-        };
-        project.targets['serve-custom-server'] = {
-            executor: '@nx/js:node',
-            defaultConfiguration: 'development',
-            options: {
-                buildTarget: `${options.project}:build-custom-server`,
+async function customServerGenerator(host, options) {
+    const project = (0, devkit_1.readProjectConfiguration)(host, options.project);
+    if (project.targets?.build?.executor !== '@nx/next:build' &&
+        project.targets?.build?.executor !== '@nrwl/next:build') {
+        devkit_1.logger.error(`Project ${options.project} is not a Next.js project. Did you generate it with "nx g @nx/next:app"?`);
+        return;
+    }
+    const outputPath = project.targets?.build?.options?.outputPath;
+    const root = project.root;
+    if (!root ||
+        !outputPath ||
+        !project.targets?.build?.configurations?.development ||
+        !project.targets?.build?.configurations?.production) {
+        devkit_1.logger.error(`Project ${options.project} has invalid config. Did you generate it with "nx g @nx/next:app"?`);
+        return;
+    }
+    if (project.targets?.['build-custom-server'] ||
+        project.targets?.['serve-custom-server']) {
+        devkit_1.logger.warn(`Project ${options.project} has custom server targets already: build-custom-server, serve-custom-server. Remove these targets from project and try again.`);
+        return;
+    }
+    (0, devkit_1.generateFiles)(host, (0, path_1.join)(__dirname, 'files'), project.root, {
+        ...options,
+        offsetFromRoot: (0, devkit_1.offsetFromRoot)(project.root),
+        projectRoot: project.root,
+        tmpl: '',
+    });
+    project.targets.build.dependsOn = ['build-custom-server'];
+    project.targets.serve.options.customServerTarget = `${options.project}:serve-custom-server`;
+    project.targets.serve.configurations.development.customServerTarget = `${options.project}:serve-custom-server:development`;
+    project.targets.serve.configurations.production.customServerTarget = `${options.project}:serve-custom-server:production`;
+    project.targets['build-custom-server'] = {
+        executor: '@nx/js:tsc',
+        defaultConfiguration: 'production',
+        options: {
+            outputPath,
+            main: `${root}/server/main.ts`,
+            tsConfig: `${root}/tsconfig.server.json`,
+            clean: false,
+            assets: [],
+        },
+        configurations: {
+            development: {},
+            production: {},
+        },
+    };
+    project.targets['serve-custom-server'] = {
+        executor: '@nx/js:node',
+        defaultConfiguration: 'development',
+        options: {
+            buildTarget: `${options.project}:build-custom-server`,
+        },
+        configurations: {
+            development: {
+                buildTarget: `${options.project}:build-custom-server:development`,
             },
-            configurations: {
-                development: {
-                    buildTarget: `${options.project}:build-custom-server:development`,
-                },
-                production: {
-                    buildTarget: `${options.project}:build-custom-server:production`,
-                },
+            production: {
+                buildTarget: `${options.project}:build-custom-server:production`,
             },
-        };
-        (0, devkit_1.updateProjectConfiguration)(host, options.project, project);
-        (0, devkit_1.updateJson)(host, 'nx.json', (json) => {
-            var _a, _b;
-            var _c;
-            (_a = json.tasksRunnerOptions) !== null && _a !== void 0 ? _a : (json.tasksRunnerOptions = {});
-            (_b = (_c = json.tasksRunnerOptions).default) !== null && _b !== void 0 ? _b : (_c.default = { options: {} });
+        },
+    };
+    (0, devkit_1.updateProjectConfiguration)(host, options.project, project);
+    (0, devkit_1.updateJson)(host, 'nx.json', (json) => {
+        if (!json.tasksRunnerOptions?.default?.options?.cacheableOperations?.includes('build-custom-server')) {
+            json.tasksRunnerOptions ??= {};
+            json.tasksRunnerOptions.default ??= { options: {} };
             json.tasksRunnerOptions.default.options.cacheableOperations = [
                 ...json.tasksRunnerOptions.default.options.cacheableOperations,
                 'build-custom-server',
             ];
-            return json;
-        });
+        }
+        return json;
     });
 }
 exports.customServerGenerator = customServerGenerator;

package/src/generators/cypress-component-configuration/cypress-component-configuration.js

@@ -1,75 +1,73 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.cypressComponentConfiguration = void 0;
-const tslib_1 = require("tslib");
 const devkit_1 = require("@nx/devkit");
 const ct_utils_1 = require("@nx/react/src/utils/ct-utils");
 const versions_1 = require("../../utils/versions");
 const react_1 = require("@nx/react");
 const path_1 = require("path");
-function cypressComponentConfiguration(tree, options) {
-    return tslib_1.__awaiter(this, void 0, void 0, function* () {
-        const tasks = [];
-        const { componentConfigurationGenerator: baseCyCtConfig } = (0, devkit_1.ensurePackage)('@nx/cypress', versions_1.nxVersion);
-        tasks.push(yield baseCyCtConfig(tree, {
-            project: options.project,
-            skipFormat: true,
-        }));
-        const { webpackInitGenerator } = (0, devkit_1.ensurePackage)('@nx/webpack', versions_1.nxVersion);
-        tasks.push(yield webpackInitGenerator(tree, {
-            compiler: 'swc',
-            uiFramework: 'react',
-            skipFormat: true,
-        }));
-        const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.project);
-        projectConfig.targets['component-test'].options = Object.assign(Object.assign({}, projectConfig.targets['component-test'].options), { skipServe: true });
-        (0, devkit_1.updateProjectConfiguration)(tree, options.project, projectConfig);
-        yield addFiles(tree, projectConfig, options);
-        if (!options.skipFormat) {
-            yield (0, devkit_1.formatFiles)(tree);
-        }
-        return (0, devkit_1.runTasksInSerial)(...tasks);
-    });
+async function cypressComponentConfiguration(tree, options) {
+    const tasks = [];
+    const { componentConfigurationGenerator: baseCyCtConfig } = (0, devkit_1.ensurePackage)('@nx/cypress', versions_1.nxVersion);
+    tasks.push(await baseCyCtConfig(tree, {
+        project: options.project,
+        skipFormat: true,
+    }));
+    const { webpackInitGenerator } = (0, devkit_1.ensurePackage)('@nx/webpack', versions_1.nxVersion);
+    tasks.push(await webpackInitGenerator(tree, {
+        compiler: 'swc',
+        uiFramework: 'react',
+        skipFormat: true,
+    }));
+    const projectConfig = (0, devkit_1.readProjectConfiguration)(tree, options.project);
+    projectConfig.targets['component-test'].options = {
+        ...projectConfig.targets['component-test'].options,
+        skipServe: true,
+    };
+    (0, devkit_1.updateProjectConfiguration)(tree, options.project, projectConfig);
+    await addFiles(tree, projectConfig, options);
+    if (!options.skipFormat) {
+        await (0, devkit_1.formatFiles)(tree);
+    }
+    return (0, devkit_1.runTasksInSerial)(...tasks);
 }
 exports.cypressComponentConfiguration = cypressComponentConfiguration;
-function addFiles(tree, projectConfig, opts) {
-    return tslib_1.__awaiter(this, void 0, void 0, function* () {
-        const { addMountDefinition, addDefaultCTConfig } = yield Promise.resolve().then(() => require('@nx/cypress/src/utils/config'));
-        const ctFile = (0, devkit_1.joinPathFragments)(projectConfig.root, 'cypress', 'support', 'component.ts');
-        const updatedCommandFile = yield addMountDefinition(tree.read(ctFile, 'utf-8'));
-        tree.write(ctFile, `import { mount } from 'cypress/react18';\nimport './styles.ct.css';\n${updatedCommandFile}`);
-        const cyFile = (0, devkit_1.joinPathFragments)(projectConfig.root, 'cypress.config.ts');
-        const updatedCyConfig = yield addDefaultCTConfig(tree.read(cyFile, 'utf-8'));
-        tree.write(cyFile, `import { nxComponentTestingPreset } from '@nx/next/plugins/component-testing';\n${updatedCyConfig}`);
-        const isUsingTailwind = ['js', 'cjs'].some((ext) => tree.exists((0, devkit_1.joinPathFragments)(projectConfig.root, `tailwind.config.${ext}`)));
-        tree.write((0, devkit_1.joinPathFragments)(projectConfig.root, 'cypress', 'support', 'styles.ct.css'), `/* This is where you can load global styles to apply to all components. */
+async function addFiles(tree, projectConfig, opts) {
+    const { addMountDefinition, addDefaultCTConfig } = await Promise.resolve().then(() => require('@nx/cypress/src/utils/config'));
+    const ctFile = (0, devkit_1.joinPathFragments)(projectConfig.root, 'cypress', 'support', 'component.ts');
+    const updatedCommandFile = await addMountDefinition(tree.read(ctFile, 'utf-8'));
+    tree.write(ctFile, `import { mount } from 'cypress/react18';\nimport './styles.ct.css';\n${updatedCommandFile}`);
+    const cyFile = (0, devkit_1.joinPathFragments)(projectConfig.root, 'cypress.config.ts');
+    const updatedCyConfig = await addDefaultCTConfig(tree.read(cyFile, 'utf-8'));
+    tree.write(cyFile, `import { nxComponentTestingPreset } from '@nx/next/plugins/component-testing';\n${updatedCyConfig}`);
+    const isUsingTailwind = ['js', 'cjs'].some((ext) => tree.exists((0, devkit_1.joinPathFragments)(projectConfig.root, `tailwind.config.${ext}`)));
+    tree.write((0, devkit_1.joinPathFragments)(projectConfig.root, 'cypress', 'support', 'styles.ct.css'), `/* This is where you can load global styles to apply to all components. */
 ${isUsingTailwind
-            ? `@tailwind base;
+        ? `@tailwind base;
 @tailwind components;
 @tailwind utilities;`
-            : ''}
+        : ''}
 `);
-        if (opts.generateTests) {
-            const filePaths = [];
-            (0, devkit_1.visitNotIgnoredFiles)(tree, projectConfig.sourceRoot, (filePath) => {
-                const fromProjectRootPath = (0, path_1.relative)(projectConfig.root, filePath);
-                // we don't generate tests for pages/server-side/appDir components
-                if (fromProjectRootPath.includes('pages') ||
-                    fromProjectRootPath.includes('server') ||
-                    fromProjectRootPath.includes('app')) {
-                    return;
-                }
-                if ((0, ct_utils_1.isComponent)(tree, filePath)) {
-                    filePaths.push(filePath);
-                }
-            });
-            for (const filePath of filePaths) {
-                yield (0, react_1.componentTestGenerator)(tree, {
-                    project: opts.project,
-                    componentPath: filePath,
-                });
+    if (opts.generateTests) {
+        const filePaths = [];
+        (0, devkit_1.visitNotIgnoredFiles)(tree, projectConfig.sourceRoot, (filePath) => {
+            const fromProjectRootPath = (0, path_1.relative)(projectConfig.root, filePath);
+            // we don't generate tests for pages/server-side/appDir components
+            if (fromProjectRootPath.includes('pages') ||
+                fromProjectRootPath.includes('server') ||
+                fromProjectRootPath.includes('app')) {
+                return;
             }
+            if ((0, ct_utils_1.isComponent)(tree, filePath)) {
+                filePaths.push(filePath);
+            }
+        });
+        for (const filePath of filePaths) {
+            await (0, react_1.componentTestGenerator)(tree, {
+                project: opts.project,
+                componentPath: filePath,
+            });
         }
-    });
+    }
 }
 exports.default = cypressComponentConfiguration;

package/src/generators/init/init.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.nextInitSchematic = exports.nextInitGenerator = void 0;
-const tslib_1 = require("tslib");
 const devkit_1 = require("@nx/devkit");
 const versions_1 = require("@nx/react/src/utils/versions");
 const init_1 = require("@nx/react/src/generators/init/init");
@@ -19,39 +18,43 @@ function updateDependencies(host) {
         'eslint-config-next': versions_2.eslintConfigNextVersion,
     });
 }
-function nextInitGenerator(host, schema) {
-    return tslib_1.__awaiter(this, void 0, void 0, function* () {
-        const tasks = [];
-        tasks.push(yield (0, js_1.initGenerator)(host, Object.assign(Object.assign({}, schema), { skipFormat: true })));
-        if (!schema.unitTestRunner || schema.unitTestRunner === 'jest') {
-            const { jestInitGenerator } = (0, devkit_1.ensurePackage)('@nx/jest', versions_2.nxVersion);
-            const jestTask = yield jestInitGenerator(host, schema);
-            tasks.push(jestTask);
-        }
-        if (schema.e2eTestRunner === 'cypress') {
-            const { cypressInitGenerator } = (0, devkit_1.ensurePackage)('@nx/cypress', versions_2.nxVersion);
-            const cypressTask = yield cypressInitGenerator(host, {});
-            tasks.push(cypressTask);
-        }
-        else if (schema.e2eTestRunner === 'playwright') {
-            const { initGenerator } = (0, devkit_1.ensurePackage)('@nx/playwright', versions_2.nxVersion);
-            const playwrightTask = yield initGenerator(host, {
-                skipFormat: true,
-                skipPackageJson: schema.skipPackageJson,
-            });
-            tasks.push(playwrightTask);
-        }
-        // @ts-ignore
-        // TODO(jack): remove once the React Playwright PR lands first
-        const reactTask = yield (0, init_1.default)(host, Object.assign(Object.assign({}, schema), { skipFormat: true }));
-        tasks.push(reactTask);
-        if (!schema.skipPackageJson) {
-            const installTask = updateDependencies(host);
-            tasks.push(installTask);
-        }
-        (0, add_gitignore_entry_1.addGitIgnoreEntry)(host);
-        return (0, devkit_1.runTasksInSerial)(...tasks);
+async function nextInitGenerator(host, schema) {
+    const tasks = [];
+    tasks.push(await (0, js_1.initGenerator)(host, {
+        ...schema,
+        skipFormat: true,
+    }));
+    if (!schema.unitTestRunner || schema.unitTestRunner === 'jest') {
+        const { jestInitGenerator } = (0, devkit_1.ensurePackage)('@nx/jest', versions_2.nxVersion);
+        const jestTask = await jestInitGenerator(host, schema);
+        tasks.push(jestTask);
+    }
+    if (schema.e2eTestRunner === 'cypress') {
+        const { cypressInitGenerator } = (0, devkit_1.ensurePackage)('@nx/cypress', versions_2.nxVersion);
+        const cypressTask = await cypressInitGenerator(host, {});
+        tasks.push(cypressTask);
+    }
+    else if (schema.e2eTestRunner === 'playwright') {
+        const { initGenerator } = (0, devkit_1.ensurePackage)('@nx/playwright', versions_2.nxVersion);
+        const playwrightTask = await initGenerator(host, {
+            skipFormat: true,
+            skipPackageJson: schema.skipPackageJson,
+        });
+        tasks.push(playwrightTask);
+    }
+    // @ts-ignore
+    // TODO(jack): remove once the React Playwright PR lands first
+    const reactTask = await (0, init_1.default)(host, {
+        ...schema,
+        skipFormat: true,
     });
+    tasks.push(reactTask);
+    if (!schema.skipPackageJson) {
+        const installTask = updateDependencies(host);
+        tasks.push(installTask);
+    }
+    (0, add_gitignore_entry_1.addGitIgnoreEntry)(host);
+    return (0, devkit_1.runTasksInSerial)(...tasks);
 }
 exports.nextInitGenerator = nextInitGenerator;
 exports.default = nextInitGenerator;