Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ng generate error #10653

Closed
nginx17 opened this issue May 4, 2018 · 72 comments · Fixed by angular/devkit#990
Closed

ng generate error #10653

nginx17 opened this issue May 4, 2018 · 72 comments · Fixed by angular/devkit#990

Comments

@nginx17
Copy link

nginx17 commented May 4, 2018

Versions

Angular CLI: 6.0.0
Node: 8.9.1
OS: linux x64
Angular: 6.0.0
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, http, language-service, material, platform-browser
... platform-browser-dynamic, platform-server, router

Package Version

angular-devkit/architect 0.6.0
angular-devkit/build-angular 0.6.0
angular-devkit/build-optimizer 0.6.0
angular-devkit/core 0.6.0
angular-devkit/schematics 0.6.0
ngtools/webpack 6.0.0
schematics/angular 0.6.0
schematics/update 0.6.0
rxjs 6.1.0
typescript 2.7.2
webpack 4.6.0

Repro steps

ng g component home

Could not find an NgModule. Use the skip-import option to skip importing in NgModule.

ng g component home --skip-import (same as generate everything)

Success generate component but wrong path not inside "src" but create new folder in root "home/user/PATH/app-id/home/home.component.*

screenshot from 2018-05-05 04-30-43

@WillsXiao
Copy link

I have met the same issue.

@TedCorleone
Copy link

@nginx17 @WillsXiao , try to restart the terminal, issue caused by new thread.

@WillsXiao
Copy link

@TedCorleone I've tried it. It didn't work

@wdev1980
Copy link

wdev1980 commented May 5, 2018

I have the same issue on OSX.

@nginx17
Copy link
Author

nginx17 commented May 5, 2018

@TedCorleone same as @WillsXiao didn't work
I tried to restart the terminal and restart my computer but it still didn't work

@matheusdavidson
Copy link

matheusdavidson commented May 6, 2018

same here on OSX, not only generates in the project root folder, but with all the path down to my project root folder.

My project:
/var/www/project/

When i generate, for example, home module:
/var/www/project/var/www/project/home/

@matheusdavidson
Copy link

Just generated a new angular 6 project and tried to generate a module or a component and had the same issue, i`m using the latest version:

Angular CLI: 6.0.0
Node: 9.10.1
OS: darwin x64
Angular: 6.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.0
@angular-devkit/build-angular     0.6.0
@angular-devkit/build-optimizer   0.6.0
@angular-devkit/core              0.6.0
@angular-devkit/schematics        0.6.0
@ngtools/webpack                  6.0.0
@schematics/angular               0.6.0
@schematics/update                0.6.0
rxjs                              6.1.0
typescript                        2.7.2
webpack                           4.6.0

@stewones
Copy link

stewones commented May 6, 2018

Same here

@sandangel
Copy link

the generated file should be put in the default project. For now, you must specify the project name with --project projectName

@nginx17
Copy link
Author

nginx17 commented May 6, 2018

@sandangel still doesn't work

@sandangel
Copy link

@nginx17 notice that your project must be placed in the projectRoot folder configued in angular.json

ng g c home --project example
CREATE projects/example/src/app/home/home.component.css (0 bytes)
CREATE projects/example/src/app/home/home.component.html (23 bytes)
CREATE projects/example/src/app/home/home.component.spec.ts (614 bytes)
CREATE projects/example/src/app/home/home.component.ts (257 bytes)
UPDATE projects/example/src/app/app.module.ts (442 bytes)

@nginx17
Copy link
Author

nginx17 commented May 6, 2018

@sandangel i try

screenshot from 2018-05-06 23-50-30

screenshot from 2018-05-07 00-03-03

screenshot from 2018-05-06 23-52-46

what i missed, angular.json default generated, not change

@matheusdavidson
Copy link

matheusdavidson commented May 6, 2018

@sandangel, still not working

captura de tela 2018-05-06 as 14 36 19

It says there is no ngModule because its looking in the wrong place, what OS are you using?

@matheusdavidson
Copy link

If i try to create a module for example, it looks like it creates in the right place:
captura de tela 2018-05-06 as 14 39 21

but it doesn't:
captura de tela 2018-05-06 as 14 39 44

@nginx17
Copy link
Author

nginx17 commented May 6, 2018

@matheusdavidson i think this is not about OS, you used OSX and i used Linux, but problem is same. i don't know how about windows

@johren02
Copy link

johren02 commented May 6, 2018

I am also having this problem.

@tdenkler0002
Copy link

Samesies. Having the problem as well. With brand new project generation -- default angular.json.

@sandangel
Copy link

sandangel commented May 6, 2018

hi everyone, try this:

ng new newproj
ng g app example #generate another app
ng g c home --project example #generate component in example app

I guess your global ng cli was not updated to v6 or ng v6 does not recognize project not placed in "projects" folder.
mine work fine:

ng new newproj               
CREATE newproj/README.md (1024 bytes)
CREATE newproj/angular.json (3408 bytes)
CREATE newproj/package.json (1311 bytes)
CREATE newproj/tsconfig.json (384 bytes)
CREATE newproj/tslint.json (2805 bytes)
CREATE newproj/.editorconfig (245 bytes)
CREATE newproj/.gitignore (503 bytes)
CREATE newproj/src/environments/environment.prod.ts (51 bytes)
CREATE newproj/src/environments/environment.ts (631 bytes)
CREATE newproj/src/favicon.ico (5430 bytes)
CREATE newproj/src/index.html (294 bytes)
CREATE newproj/src/main.ts (370 bytes)
CREATE newproj/src/polyfills.ts (3194 bytes)
CREATE newproj/src/test.ts (642 bytes)
CREATE newproj/src/assets/.gitkeep (0 bytes)
CREATE newproj/src/styles.css (80 bytes)
CREATE newproj/src/browserslist (375 bytes)
CREATE newproj/src/karma.conf.js (964 bytes)
CREATE newproj/src/tsconfig.app.json (194 bytes)
CREATE newproj/src/tsconfig.spec.json (282 bytes)
CREATE newproj/src/tslint.json (314 bytes)
CREATE newproj/src/app/app.module.ts (314 bytes)
CREATE newproj/src/app/app.component.css (0 bytes)
CREATE newproj/src/app/app.component.html (1141 bytes)
CREATE newproj/src/app/app.component.spec.ts (986 bytes)
CREATE newproj/src/app/app.component.ts (207 bytes)
CREATE newproj/e2e/protractor.conf.js (752 bytes)
CREATE newproj/e2e/src/app.e2e-spec.ts (299 bytes)
CREATE newproj/e2e/src/app.po.ts (208 bytes)
CREATE newproj/e2e/tsconfig.e2e.json (213 bytes)

> fsevents@1.2.3 install /Users/sand/Downloads/newproj/node_modules/fsevents
> node install

[fsevents] Success: "/Users/sand/Downloads/newproj/node_modules/fsevents/lib/binding/Release/node-v57-darwin-x64/fse.node" already installed
Pass --update-binary to reinstall or --build-from-source to recompile

> node-sass@4.9.0 install /Users/sand/Downloads/newproj/node_modules/node-sass
> node scripts/install.js

Cached binary found at /Users/sand/.npm/node-sass/4.9.0/darwin-x64-57_binding.node

> node-sass@4.9.0 postinstall /Users/sand/Downloads/newproj/node_modules/node-sass
> node scripts/build.js

Binary found at /Users/sand/Downloads/newproj/node_modules/node-sass/vendor/darwin-x64-57/binding.node
Testing binary
Binary is fine

> @angular/cli@6.0.0 postinstall /Users/sand/Downloads/newproj/node_modules/@angular/cli
> node ./bin/ng-update-message.js

added 1146 packages from 1269 contributors in 20.672s
    Successfully initialized git.

##################################################################################
ng g c home --project newproj
CREATE src/app/home/home.component.css (0 bytes)
CREATE src/app/home/home.component.html (23 bytes)
CREATE src/app/home/home.component.spec.ts (614 bytes)
CREATE src/app/home/home.component.ts (261 bytes)
UPDATE src/app/app.module.ts (388 bytes)

@johren02
Copy link

johren02 commented May 6, 2018

@sandangel what do you mean by "ng v6 does not recognize project not placed in "projects" folder"? are you in a projects directory in your example? I assume all commands are run from the same directory level in your example

@sandangel
Copy link

sandangel commented May 6, 2018

@johren01 I mean with a newly created project, cli will generate app files under "src" folder, but if we generate a new app, by ng g app, generated files will be placed under "projects" folder. So I think when using ng g c home --project projName, if the projName is not placed under "projects" folder, the generated path might be wrong. I have tried but mine works fine for both project under "src" folder and "projects" folder. So I think may be your global cli version was not upgraded to 6. That what I guess based on your provided information. I can't reproduce your issue now on my macOS machine

@johren02
Copy link

johren02 commented May 6, 2018 via email

@tdenkler0002
Copy link

Haha my issue was much more of a noob mistake. Upgraded my ng cli globally, but did not exit terminal for it to refresh (my guess) because now it seems to work just fine. :)

@WillsXiao
Copy link

WillsXiao commented May 8, 2018

I've solved my issued on my computer. My problems are below:

  1. Because my working path is too deep, so I used command line $ ln -s to create the link on my root path.
  2. I go to my project use the link which I created. When I use the command line $ pwd to get the path that is /Users/admin/angular/newProject. But my original path is /Users/admin/Desktop/localDisk/04-www/angular/newProject.

Solve the problem

  1. Go to the project through original path

The angular results are below:

Mac:day01 admin$ ng g c components/header
CREATE src/app/components/header/header.component.css (0 bytes)
CREATE src/app/components/header/header.component.html (25 bytes)
CREATE src/app/components/header/header.component.spec.ts (628 bytes)
CREATE src/app/components/header/header.component.ts (269 bytes)
UPDATE src/app/app.module.ts (481 bytes)

Here is my angular info

Angular CLI: 6.0.0
Node: 9.4.0
OS: darwin x64
Angular: 6.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.0
@angular-devkit/build-angular     0.6.0
@angular-devkit/build-optimizer   0.6.0
@angular-devkit/core              0.6.0
@angular-devkit/schematics        0.6.0
@ngtools/webpack                  6.0.0
@schematics/angular               0.6.0
@schematics/update                0.6.0
rxjs                              6.1.0
typescript                        2.7.2
webpack                           4.6.0

@matheusdavidson
Copy link

@WillsXiao, It shoudn’t be so difficult do generate things, that may be a workaround, not a solution.

@nginx17
Copy link
Author

nginx17 commented May 8, 2018

@sandangel Problem solved, my case is same as @WillsXiao

@rfuhrer
Copy link

rfuhrer commented Jun 6, 2018

It looks like this was released in devkit 6.0.8 (CLI 6.0.8) but I'm still having the same problem:

PS C:\git\PrimeCore\Prime.Core> ng --version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 6.0.8
Node: 10.3.0
OS: win32 x64
Angular: 6.0.4
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.8
@angular-devkit/build-angular     0.6.8
@angular-devkit/build-optimizer   0.6.8
@angular-devkit/core              0.6.8
@angular-devkit/schematics        0.6.8
@angular/cdk                      6.2.0
@angular/cli                      6.0.8
@angular/flex-layout              6.0.0-beta.15
@angular/material                 6.2.0
@ngtools/webpack                  6.0.8
@schematics/angular               0.6.8
@schematics/update                0.6.8
rxjs                              6.2.0
typescript                        2.7.2
webpack                           4.8.3

PS C:\git\PrimeCore\Prime.Core> ng g c shared/components/job-info
Could not find an NgModule. Use the skip-import option to skip importing in NgModule.
PS C:\git\PrimeCore\Prime.Core> ng g c /shared/components/job-info
Could not find an NgModule. Use the skip-import option to skip importing in NgModule.
PS C:\git\PrimeCore\Prime.Core> ng g c app/shared/components/job-info
Could not find an NgModule. Use the skip-import option to skip importing in NgModule.
PS C:\git\PrimeCore\Prime.Core> ng g c /app/shared/components/job-info
Could not find an NgModule. Use the skip-import option to skip importing in NgModule.
PS C:\git\PrimeCore\Prime.Core> ng g c /app/shared/components/job-info --path ClientApp
Could not find an NgModule. Use the skip-import option to skip importing in NgModule.
PS C:\git\PrimeCore\Prime.Core> ng g c shared/components/job-info --path ClientApp/app
CREATE ClientApp/app/shared/components/job-info/job-info.component.html (27 bytes)
CREATE ClientApp/app/shared/components/job-info/job-info.component.spec.ts (636 bytes)
CREATE ClientApp/app/shared/components/job-info/job-info.component.ts (278 bytes)
CREATE ClientApp/app/shared/components/job-info/job-info.component.scss (0 bytes)
UPDATE ClientApp/app/shared/shared.module.ts (1773 bytes)

and the angular.json which hasn't changed since upgrading to 6.0.0:

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "prime-core-cli": {
      "root": "",
      "sourceRoot": "ClientApp",
      "projectType": "application",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
...

@Timvdv
Copy link

Timvdv commented Jun 10, 2018

I also have this problem. Not sure if it helps but it looks like it's looking in the wrong directory for the NgModule. I think it's looking in the e2e directory instead of the src

schermafbeelding 2018-06-10 om 18 27 06

@darinclark
Copy link

Still broken; though maybe broken in a different way. It seems to be ignoring the 'defaultProject' setting, and instead yanking the last project out of the list of projects. If I reorder my angular.json file such that the -e2e project is first, and the standard project is second, then generation of a new component goes into the correct location, instead of attempting to drop into -e2e.

@rfuhrer
Copy link

rfuhrer commented Jun 11, 2018

@darinclark Nailed it! I just tested by reordering my angular.json projects listing to put the e2e project first and the main project 2nd and then everything started working.

I found this already reported: #11111

@dtekchandani
Copy link

After upgrading cli to 6.0.8, cli is generating everything inside e2e folder.

rafacandev added a commit to rafacandev/matchandtrade-web-ui that referenced this issue Jun 18, 2018
@durbonas
Copy link

@rfuhrer That worked for me!! Thanks.

Just pasting it here for others. Very simple fix for now.

It appears to just grab the last project in your angular.json. So if you have a main project and then a e2e project, reorder them so the main project is last and your default generate commands will go to the main project instead of e2e. If you need to generate something to the e2e project then you can use the --path e2e override

@beiatisi
Copy link

You can use "ng new you_project_name" copy angular.json paste to your original project directory.

@grimace
Copy link

grimace commented Jun 24, 2018

this is still happening on 6.0.8.

This also still happened to me after moving the non e2e project after the others. And this happened to me because I ran 'ng update' on my project.

found the answer here:
https://github.com/angular/angular-cli/issues/11111

basically, find the 'project name'-e2e
set:
"root": "e2e/",
and remove:
"sourceRoot": "e2e",

@srkt
Copy link

srkt commented Jun 25, 2018

Worked by moving the e2e project in angular.json to top of the project list

@grimace
Copy link

grimace commented Jun 25, 2018

That didn't work for me, hence more digging and now works without moving projects in angular.json.

@dkteam
Copy link

dkteam commented Jun 26, 2018

Fix here, everyone.

rafacandev/matchandtrade-web-ui@a5e6b60

@ivyblossom
Copy link

Thanks @dkteam 👏
It worked for me 🎉

@ZdebK
Copy link

ZdebK commented Jun 27, 2018

For me worked that I changed the path. I was in src folder.
cd ../
fixed this :D

@PawelOwczarekFalcon
Copy link

@grimace works fine :)

@agroupp
Copy link

agroupp commented Jul 9, 2018

@grimace was very helpful, thanks

@chrisBosse
Copy link

chrisBosse commented Jul 17, 2018

Very much like @grimace 's workaround above.

For me, I was able to leave the project order the same in angular.json and only change the e2e project's"root" path.

{
  "projects": {
    "myGreatApp": {
      "root": ""
    },
    "myGreatApp-e2e": {
      "root": "e2e"
      }
  }
}    

"projects"."myGreatApp-e2e"."root" changes from "" to "e2e" allowing the ng g module test command to build the module in the correct location. We don't use e2e so I don't know what else this breaks. Easy enough, as a workaround, to change and put back just before building an new module.

Angular 6.0.6
Angular CLI 6.0.8
angular-devkit/schematics 0.6.8

@jgswiss
Copy link

jgswiss commented Jul 25, 2018

Deleting the "e2e" in angular.json under:
"app-e2e": {
"root": "",
"sourceRoot": "e2e",
"projectType": "application"

to

"app-e2e": {
"root": "",
"sourceRoot": "",
"projectType": "application",

fixed my problem!

@Eternal21
Copy link

Same problem on Windows, after upgrading to the latest cli (6.1.1). The solution that worked for me was suggested by @srkt

  1. Open angular.json (it should be right in the root of your app)
  2. Find "projects" property.
  3. Inside the project property you will see two children properties:
    "yourappname-app" and "yourappname-app-e2e"
  4. Switch their order (cut the "yourname-app-e2e" property and their children, and place them above "yourappname-app" property)
  5. I had to restart VS Code for it to start working (you may need to restart your terminal or whatever you're using)

@gremo
Copy link

gremo commented Jul 28, 2018

I'm not having any problem changing the root folder from src to client with CLI version 6.1 (installed globally) on Windows 10 x64. Here is what I did:

ng new ng-test --style scss --skip-install

Save the patch file root-change.diff:

diff --git a/angular.json b/angular.json
index 56f7e2e..2d30500 100644
--- a/angular.json
+++ b/angular.json
@@ -5,7 +5,7 @@
   "projects": {
     "ng-test": {
       "root": "",
-      "sourceRoot": "src",
+      "sourceRoot": "client",
       "projectType": "application",
       "prefix": "app",
       "schematics": {
@@ -18,16 +18,16 @@
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
             "outputPath": "dist/ng-test",
-            "index": "src/index.html",
-            "main": "src/main.ts",
-            "polyfills": "src/polyfills.ts",
-            "tsConfig": "src/tsconfig.app.json",
+            "index": "client/index.html",
+            "main": "client/main.ts",
+            "polyfills": "client/polyfills.ts",
+            "tsConfig": "client/tsconfig.app.json",
             "assets": [
-              "src/favicon.ico",
-              "src/assets"
+              "client/favicon.ico",
+              "client/assets"
             ],
             "styles": [
-              "src/styles.scss"
+              "client/styles.scss"
             ],
             "scripts": []
           },
@@ -35,8 +35,8 @@
             "production": {
               "fileReplacements": [
                 {
-                  "replace": "src/environments/environment.ts",
-                  "with": "src/environments/environment.prod.ts"
+                  "replace": "client/environments/environment.ts",
+                  "with": "client/environments/environment.prod.ts"
                 }
               ],
               "optimization": true,
@@ -71,17 +71,17 @@
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
-            "main": "src/test.ts",
-            "polyfills": "src/polyfills.ts",
-            "tsConfig": "src/tsconfig.spec.json",
-            "karmaConfig": "src/karma.conf.js",
+            "main": "client/test.ts",
+            "polyfills": "client/polyfills.ts",
+            "tsConfig": "client/tsconfig.spec.json",
+            "karmaConfig": "client/karma.conf.js",
             "styles": [
-              "src/styles.scss"
+              "client/styles.scss"
             ],
             "scripts": [],
             "assets": [
-              "src/favicon.ico",
-              "src/assets"
+              "client/favicon.ico",
+              "client/assets"
             ]
           }
         },
@@ -89,8 +89,8 @@
           "builder": "@angular-devkit/build-angular:tslint",
           "options": {
             "tsConfig": [
-              "src/tsconfig.app.json",
-              "src/tsconfig.spec.json"
+              "client/tsconfig.app.json",
+              "client/tsconfig.spec.json"
             ],
             "exclude": [
               "**/node_modules/**"
@@ -128,4 +128,4 @@
     }
   },
   "defaultProject": "ng-test"
-}
\ No newline at end of file
+}
diff --git a/client/tsconfig.app.json b/client/tsconfig.app.json
index 8ea061e..7e02a41 100644
--- a/client/tsconfig.app.json
+++ b/client/tsconfig.app.json
@@ -5,7 +5,7 @@
     "types": []
   },
   "exclude": [
-    "src/test.ts",
+    "client/test.ts",
     "**/*.spec.ts"
   ]
 }

Apply the patch file and install vendor:

git apply root-change.diff
npm i

All the following commands works:

ng serve --open
ng build --prod
ng test
ng e2e

Component generation will correctly generate the component in the new root folder:

ng g c home --dry-run
CREATE client/app/home/home.component.html (23 bytes)
CREATE client/app/home/home.component.spec.ts (614 bytes)
CREATE client/app/home/home.component.ts (262 bytes)
CREATE client/app/home/home.component.scss (0 bytes)
UPDATE client/app/app.module.ts (388 bytes)

$ ng g m core --dry-run
CREATE client/app/core/core.module.spec.ts (259 bytes)
CREATE client/app/core/core.module.ts (188 bytes)

@zachgoll
Copy link

My fix was fairly simple:

Problem: I was running the command ng generate component components/home (create the "home" component in the components directory) from the location of angular-project/src/.

Solution: Back out into the root of your angular project and specify the path you want the component to generate in like so:

ng generate component src/components/home

The above command should create a "home" component in the components/ directory inside the src/ directory.

Hope that helps!

@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 8, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging a pull request may close this issue.