Nx: yarn - ng g app - Could not find NgModule

[froodley]

I use yarn instead of npm

If I run npm to install my node_modules, ng g app works just fine.

If I use yarn to install node_modules, ng g app produces this output:

$ ng g app test2
Error: Could not find an NgModule for the new component. Use the skip-import option to skip importing components in NgModule.
Could not find an NgModule for the new component. Use the skip-import option to skip importing components in NgModule.

This is in both ubuntu 17 and MinGW

[vsavkin]

Could you provide a repro (a github repo(?

[froodley]

Sure: https://github.com/froodley/yarn-problem

But it's just a clean install via create-nx-workspace, not sure how useful it will be.

lsb_release -a:
(apparently this box is still xenial, ha)
No LSB modules are available.
Distributor ID: Ubuntu
Description: Ubuntu 16.04.3 LTS
Release: 16.04
Codename: xenial

yarn: 1.3.2
node: 6.10 and 9.x both tried
npm: 5.6

Steps to repro:

create-nx-workspace yarn-problem
ng g app test1
rm -rf node_modules && yarn
ng g app test2

Output:

$ create-nx-workspace yarn-problem
Creating a sandbox with the CLI and Nx Schematics...
Cached binary found at /home/vagrant/.npm/node-sass/4.7.2/linux-x64-48_binding.node
Binary found at /tmp/tmp-10786iuYlsA7zV316/node_modules/node-sass/vendor/linux-x64-48/binding.node
Testing binary
Binary is fine
added 1172 packages in 65.991s
ng new "yarn-problem" --collection=@nrwl/schematics
create yarn-problem/.angular_cli165.tgz (147722 bytes)
create yarn-problem/README.md (1864 bytes)
create yarn-problem/.angular-cli.json (727 bytes)
create yarn-problem/.editorconfig (245 bytes)
create yarn-problem/.gitignore (516 bytes)
create yarn-problem/apps/.gitkeep (1 bytes)
create yarn-problem/karma.conf.js (1105 bytes)
create yarn-problem/libs/.gitkeep (0 bytes)
create yarn-problem/package.json (2417 bytes)
create yarn-problem/protractor.conf.js (886 bytes)
create yarn-problem/test.js (1033 bytes)
create yarn-problem/tsconfig.json (475 bytes)
create yarn-problem/tsconfig.spec.json (343 bytes)
create yarn-problem/tslint.json (2240 bytes)
Successfully initialized git.
Project 'yarn-problem' successfully created.
npm WARN deprecated [email protected]: All versions below 4.0.1 of Nodemailer are deprecated. See https://nodemailer.com/status/
npm WARN deprecated [email protected]: Use uuid module instead

[email protected] install /code/nx-test/yarn-problem/node_modules/uws
node-gyp rebuild > build_log.txt 2>&1 || exit 0

[email protected] install /code/nx-test/yarn-problem/node_modules/node-sass
node scripts/install.js

Cached binary found at /home/vagrant/.npm/node-sass/4.7.2/linux-x64-48_binding.node

[email protected] postinstall /code/nx-test/yarn-problem/node_modules/webpack/node_modules/uglifyjs-webpack-plugin
node lib/post_install.js

[email protected] postinstall /code/nx-test/yarn-problem/node_modules/node-sass
node scripts/build.js

Binary found at /code/nx-test/yarn-problem/node_modules/node-sass/vendor/linux-x64-48/binding.node
Testing binary
Binary is fine

[email protected] postinstall /code/nx-test/yarn-problem
nx migrate check

npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN [email protected] requires a peer of ajv@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

added 1497 packages in 80.515s

$ ng g app test1
Your global Angular CLI version (1.7.0) is greater than your local
version (1.6.5). The local Angular CLI version is used.

To disable this warning use "ng set --global warnings.versionMismatch=false".
create apps/test1/src/assets/.gitkeep (0 bytes)
create apps/test1/src/assets/nx-logo.png (71592 bytes)
create apps/test1/src/environments/environment.prod.ts (51 bytes)
create apps/test1/src/environments/environment.ts (387 bytes)
create apps/test1/src/favicon.ico (5430 bytes)
create apps/test1/src/index.html (291 bytes)
create apps/test1/src/main.ts (370 bytes)
create apps/test1/src/polyfills.ts (2667 bytes)
create apps/test1/src/styles.css (80 bytes)
create apps/test1/src/tsconfig.app.json (294 bytes)
create apps/test1/e2e/app.e2e-spec.ts (269 bytes)
create apps/test1/e2e/app.po.ts (201 bytes)
create apps/test1/e2e/tsconfig.e2e.json (391 bytes)
create apps/test1/src/app/app.module.ts (342 bytes)
create apps/test1/src/app/app.component.css (0 bytes)
create apps/test1/src/app/app.component.html (520 bytes)
create apps/test1/src/app/app.component.spec.ts (607 bytes)
create apps/test1/src/app/app.component.ts (258 bytes)
update .angular-cli.json (1639 bytes)

$: rm -rf node_modules && yarn
yarn install v1.3.2
info No lockfile found.
[1/4] Resolving packages...
warning karma > log4js > [email protected]: All versions below 4.0.1 of Nodemailer are deprecated. See https://nodemailer.com/status/
warning karma > log4js > loggly > request > [email protected]: Use uuid module instead
[2/4] Fetching packages...
info [email protected]: The platform "linux" is incompatible with this module.
info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
$ ./node_modules/.bin/nx migrate check
Done in 46.16s.

$ ng g app test2
Error: Could not find an NgModule for the new component. Use the skip-import option to skip importing components in NgModule.
Could not find an NgModule for the new component. Use the skip-import option to skip importing components in NgModule.

[jimdubbs]

I have the same problem, using CLI 1.7.0

[vsavkin]

Could you check in the yarn.lock file? Otherwise, I have a different installation of node_modules, which happened to work for me.

[froodley]

@vsavkin Sure, I checked in package-lock.json and yarn.lock generated from the above repro steps

[MitkoTschimev]

I have the same with npm but we have our own schematics which are extending the schematics from nrwl

{
    "$schema": "./node_modules/@angular-devkit/schematics/collection-schema.json",
    "schematics": {
        "workspace": {
            "extends": "@nrwl/schematics:workspace"
        },

        "application": {
            "extends": "@nrwl/schematics:application"
        },

        "app": {
            "extends": "@nrwl/schematics:app"
        },

        "lib": {
            "extends": "@nrwl/schematics:lib"
        },

        "ngrx": {
            "extends": "@nrwl/schematics:ngrx"
        },
        ....

but event if i use the collection it is not working:

ng generate app testapp --collection=@nrwl/schematics

This happens after update to nx 0.8.0

[mcblum]

We have also run into this same issue but for us it happens when I run ng generate app appname. I'm not sure exactly when it happened, but we were running .7.x before I upgraded to .8 today. Going to try removing node_modules and using NPM. We also typically use yarn.

We're on the CLI 1.7.2.

Update: After removing node modules and using Npm, app generation still failed.

[MichaelWarneke]

I get the problem when using Typescript 2.7.2. Changing back to 2.6.2 works fine.

[FrozenPandaz]

Please also trace further up in your file system.

It's possible you have an older version of @angular/cli installed somewhere in a parent (or grandparent etc.) directory which @angular/cli is using instead of its true global version.

A common mistake I make is that I accidentally npm install in my projects directory so I have to delete projects/node_modules while my project is in projects/my-project.

[MitkoTschimev]

I have tried a clean setup and receiving still this problem :(

node: 8.9.4
npm: 5.7.1
nx: 0.9.1

Someone found a solution?

[Aaltuj]

Any updates on this? i have the same issue. The first app creation works fine but the second one does not.
executing ng generate app components-demo --routing from the project root does not work.
Resulting in:
Error: Could not find an NgModule for the new component. Use the skip-import option to skip importing components in NgModule. Could not find an NgModule for the new component. Use the skip-import option to skip importing components in NgModule.

when i copy the default application folder and add the angular.cli.json app entry manual it runs fine

[jeffbcross]

I experienced this issue after migrating a workspace. The migration failed at https://github.com/nrwl/nx/blob/master/packages/schematics/migrations/20180225-switch-to-cli17.ts and didn't finish running the migration steps after it. The most impactful migration that was missed was the deletion of the @angular-devkit/schematics dependency from package.json.

The reason the migration failed in the first place was that I didn't have @nrwl/schematics installed globally. I manually fixed this issue by deleting the @angular-devkit/schematics dependency, and then ng g app worked fine.

[thelgevold]

Is this still an issue on the latest version of Nx?

[thelgevold]

Closing due to inactivity.