Composing generators requires '@angular-devkit/schematics'

merlosy commented 2 years ago

Current Behavior

Composing @nx-plus/vue generators triggers an error when running the generator command

PS D:\git-workspace\my-monorepo> npx nx workspace-generator create-vue-app test-app
Cannot find module '@angular-devkit/schematics'
Require stack:
- D:\git-workspace\my-monorepo\node_modules\@nrwl\workspace\src\utils\ast-utils.js       
- D:\git-workspace\my-monorepo\node_modules\@nrwl\workspace\src\utils\project-type.js    
- D:\git-workspace\my-monorepo\node_modules\@nrwl\workspace\index.js
- D:\git-workspace\my-monorepo\node_modules\@nx-plus\vue\src\generators\vuex\generator.js
- D:\git-workspace\my-monorepo\node_modules\@nx-plus\vue\src\index.js
- D:\git-workspace\my-monorepo\dist\out-tsc\tools\generators\create-vue-app\index.js     
- D:\git-workspace\my-monorepo\node_modules\nx\src\config\workspaces.js
- D:\git-workspace\my-monorepo\node_modules\nx\src\command-line\generate.js
- D:\git-workspace\my-monorepo\node_modules\nx\src\command-line\workspace-generators.js  
- D:\git-workspace\my-monorepo\node_modules\nx\src\command-line\nx-commands.js
- D:\git-workspace\my-monorepo\node_modules\nx\bin\init-local.js
- D:\git-workspace\my-monorepo\node_modules\nx\bin\nx.js

This seems to be related to the import of @nrwl/workspace

Expected Behavior

It should work out of the box, or document how to make it work

Suggestions:

option 1: add as peer dependency @angular-devkit/schematics?
option 2: refactor code to avoid importing from @nrwl/workspace (prefer @nrwl/devkit)?

Steps to Reproduce

Using a custom schematic/generator and import as follows (condensed extract):

import type { Tree } from '@nrwl/devkit';
import { logger, names } from '@nrwl/devkit';
import { applicationGenerator } from '@nx-plus/vue'; // <-- Here

/**
 * Generate the default web application
 * @param tree The virtual file system tree
 * @param schema The project configuration
 */
async function generateWebApp(tree: Tree, schema: SchematicOptions): Promise<void> {
  logger.debug('Generating the app (external schematics)');
  const name = names(schema.name).fileName;
  // "app" generator from "@nx-plus/vue"
  await applicationGenerator(tree, {
    name,
    style: 'scss',
    unitTestRunner: 'jest',
    e2eTestRunner: 'cypress',
    routing: true,
    vueVersion: 3,
    skipFormat: true,
    babel: false,
    tags: `fmk:vue,type:app,scope:${name}`,
  });
}

export default async function (tree: Tree, schema: SchematicOptions): Promise<void> {
  await generateWebApp(tree, schema);
}

Failure Logs

Environment

Plugin name and version:

Node : 16.16.0 OS : win32 x64 npm : 8.5.5

nx : 13.10.0 @nrwl/angular : Not Found @nrwl/cypress : 13.10.6 @nrwl/detox : Not Found @nrwl/devkit : 13.10.6 @nrwl/eslint-plugin-nx : 13.10.6 @nrwl/express : Not Found @nrwl/jest : 13.10.6 @nrwl/js : 13.10.6 @nrwl/linter : 13.10.6 @nrwl/nest : Not Found @nrwl/next : Not Found @nrwl/node : 13.10.6 @nrwl/nx-cloud : Not Found @nrwl/nx-plugin : Not Found @nrwl/react : Not Found @nrwl/react-native : Not Found @nrwl/schematics : Not Found @nrwl/storybook : Not Found @nrwl/web : 13.10.6 @nrwl/workspace : 13.10.6 typescript : 4.7.4 rxjs : 6.6.7

Community plugins: @nx-plus/vue: 13.0.2

merlosy commented 2 years ago

For a bit more context, these are related issues from NX repo:

ZachJW34 commented 2 years ago

Do you know if this is still an issue with the latest version of Nx and nx-plus?

danfoust commented 1 year ago

@ZachJW34 I encountered this in 15.4.4 when importing from the top-level @nrwl/workspace barrel. Fix was to import from @nrwl/workspace/generators.

https://github.com/nrwl/nx/issues/4857#issuecomment-1373955308

ZachJW34 / nx-plus