(bug) Cannot read property 'lint' of undefined when converting ng app to nrwl workspace

webmandman commented 3 years ago

Expected Behavior

Convert my angular cli workspace to an nx workspace

Results from trying to convert my existing app

Here is my current angular cli workspace file structure: All the npm script like "npm run lint" and "npm run start" work. The app runs successfully without compiler errors on port 4200. When I try to convert this workspace into a nrwl workspace by using ng add @nrwl/workspace it errors outs with "Cannot read property 'lint' of undefined.

Steps to Reproduce

git clone https://github.com/webmandman/angular-app-workspace-example.git npm install ng add @nrwl/workspace

Environment

Node : 14.11.0 OS : win32 x64 npm : 6.14.8

nx : Not Found @nrwl/angular : 8.12.11 @nrwl/cli : 11.2.10 @nrwl/cypress : 8.12.11 @nrwl/devkit : 11.2.10 @nrwl/eslint-plugin-nx : Not Found @nrwl/express : Not Found @nrwl/jest : 11.2.10 @nrwl/linter : 11.2.10 @nrwl/nest : Not Found @nrwl/next : Not Found @nrwl/node : Not Found @nrwl/react : Not Found @nrwl/schematics : 8.12.11 @nrwl/tao : 11.2.10 @nrwl/web : Not Found @nrwl/workspace : 11.2.10 typescript : 4.0.5

FrozenPandaz commented 3 years ago

You seem to have some old dependencies:

@nrwl/schematics : 8.12.11
@nrwl/cypress : 8.12.11
@nrwl/angular : 8.12.11

Is it possible for you to provide a repo to help me reproduce the error?

webmandman commented 3 years ago

I'll work on making a public version of the repo that is lightweight. First, I think I'll update the dependencies and try it again. thank you.

webmandman commented 3 years ago

the npm packages @nrwl/schematics is up to date. I didn't find a newer version than 8.12.11. I ran ng update @nrwl/schemetics

webmandman commented 3 years ago

I found the Nx Update article (https://nx.dev/latest/angular/core-concepts/updating-nx) and ran nx migrate latest, Nothing changed. So I'm not sure why you're saying those deps are old.

webmandman commented 3 years ago

@FrozenPandaz I've managed to successfully run ng add @nrwl/workspace, however, my app files are still in ./projects/employeeportal and ./apps/employeeportal only contains, karma.conf.js, tsconfig.app.json, tsconfig.spec.json. Plus the angular.json file was messed up.

I owe a repo so you can run it and reproduce it. I'm wokring on it.

In the meantime, can you tell me how to update my deps from 8.12.11 to latest. Still not sure what to do about this.

webmandman commented 3 years ago

@FrozenPandaz, after trying to make conversion work it was hard for me to revert and get it to where it can be reproduceable but here it is: https://github.com/webmandman/angular-app-workspace-example.git I did npm install, then ng add @nrwl/workspace, and got the error: Cannot read property 'lint' of undefined

FrozenPandaz commented 3 years ago

Thank you for the repo, I can reproduce the issue now :smile:

pumano commented 3 years ago

got same error now, while trying to convert current angular app to nx workspace:

ng add @nrwl/workspace
ℹ Using package manager: npm
✔ Found compatible package version: @nrwl/workspace@11.2.10.
✔ Package information loaded.
✔ Package successfully installed.

Cannot read property 'lint' of undefined

pumano commented 3 years ago

I found workaround: usually we have angular-e2e project inside angular.json but nx monorepo currently don't support transformation of multi project angular cli workspace transformation to nx monorepo workspace.

When i try to execute: ng add @nrwl/workspace --preserveAngularCLILayout I got error: The schematic can only be used with Angular CLI workspaces with a single application.

Then i found answer about it in Stackoverflow and delete my projectname-e2e from angular.json and tried ng add @nrwl/workspace and it executed successfully.

webmandman commented 3 years ago

I second that workaround.

Its my first successful run of transforming an angular cli workspace to nx workspace, but I'm not so sure it transformed it correctly. my app code is still in ./projects/employeeportal and ./apps/employeeportal was created with only: karma.conf.js tsconfig.app.json tsconfig.spec.json I didn't use --preserveAngularCLILayout. Angular.json has my projects references pointing at ./apps/employeeportal

I believe my app src files should have been moved to ./apps/...

pumano commented 3 years ago

@webmandman check folders inside /projects/employeeportal it's only empty folders. Because all data copied. That is bug too, folders should be deleted after migration.

webmandman commented 3 years ago

@pumano, all my src files were left in /projects/employeeportal. So thats a bug too.

github-actions[bot] commented 3 years ago

This issue has been automatically marked as stale because it hasn't had any recent activity. It will be closed in 14 days if no further activity occurs. If we missed this issue please reply to keep it active. Thanks for being a part of the Nx community! 🙏

Pablodotnet commented 3 years ago

I'm having this issue too with a project done with Angular CLI 8

Edit: It was because it was trying to use @nrwl/workspace version 12 and I needed to use the version 8.12.11

edmundo096 commented 3 years ago

Got into this same issue. Have an Angular project, 11.2.12 (latest non RC), with the default e2e app alongside. Using ng add @nrwl/workspace only adds "@nrwl/angular": "12.1.1" to the package.json, and fails with the Cannot read property 'lint' of undefined message.

Removing it as a workaround from the angular.json file makes the add command execute correctly, but I noticed the add command printed No e2e project was migrated because there was none declared in angular.json so the command supposedly supports migrating an e2e app as well.

Also, yes, for the 2nd bug discussed, empty directories from the previous src/app were left after the add command finished successfully .

I don't like pinging people but @FrozenPandaz this got closed automatically but it may be still considered an issue.

maxisam commented 3 years ago

Have the same issue in V12. @edmundo096 Could you share what did you remove? thx

My angular is v12 and nx is v12. So I don't understand why it doesn't work

edmundo096 commented 3 years ago

@maxisam What pumano did above, on the Feb 7 comment https://github.com/nrwl/nx/issues/4708#issuecomment-774710237:

Then i found answer about it in Stackoverflow and delete my projectname-e2e from angular.json and tried ng add @nrwl/workspace and it executed successfully.

Deleted the e2e project from the angular.json then run the migration ng add @nrwl/workspace command. Then manually re-add the e2e project and migrate it manually: move to be inside the apps directory (if not already), and update it's paths and the lint builder/executor. The lint should be something like

"lint": {
  "builder": "@nrwl/linter:eslint",
  "options": {
    "lintFilePatterns": ["apps/<proj-name>-e2e/**/*.{js,ts}"]
  }
}

You could use a fresh temporal Nx project just as reference of how it should be.

shaun-jacks commented 3 years ago

From @edmundo096's comment, I'm guessing the issue is here? https://github.com/nrwl/nx/blob/251b417a8a72bd9eb2c7df00f8ea84736571dc30/packages/workspace/src/generators/init/init.ts#L285

On my angular project the e2e lint path is [e2eProject].architect.lint not [e2eProject].targets.lint.

This happened on my Angular 11 project and also after upgrading to Angular 12

github-actions[bot] commented 1 year ago

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.

nrwl / nx