無法新建 Component ( Angular CLI: 6.0.8)

各位前輩

目前版本


/ \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|

/ △ \ | '_ \ / | | | | |/ _ | '__| | | | | | |
/ ___ | | | | (
| | || | | (| | | | || |___ | |
/
/ __| |
|_
, |_,||_,|| _||_|
|___/

Angular CLI: 6.0.8
Node: 8.9.4
OS: win32 x64
Angular: 6.0.5
… animations, common, compiler, compiler-cli, core, forms
… http, platform-browser, platform-browser-dynamic, 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/cli 6.0.8
@ngtools/webpack 6.0.8
@schematics/angular 0.6.8
@schematics/update 0.6.8
rxjs 6.2.1
typescript 2.7.2
webpack 4.8.3

最近升級到 Angular CLI . 把一個 Angular 5 的專案升到 Angular 6 後

npm start 一切正常, 但當我執行

ng g c mycom

想建一個新的 Component 時, 郤回傳

"**

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

**"

這個 Error

請問這可能的問題與解決方法是 ?

我有試著 把這 message 放到 Google 查詢

似乎非常多人遇到這個 ISSUE

但我覺得大家的回答, 都不像正確的回答

我這是一個正常且蠻單純的專案做升級

請問有其他前輩有遇到同樣的問題嗎 ?

PS

網路上有答案是這樣

我不解, 那我以後使用 ng g 任何項目, 都變成要加這個參數了 ?

目前, 我原本 Angular 5 的專案還是很正當可以使用 ng g c mycom

請問大家有什麼建議嗎 ?

可以將你的 angular.json 檔案貼上來看一下嗎

不好意思, 前幾天有事手邊沒有筆電

angular.json 如下


{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "avalon": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist",
            "index": "src/index.html",
            "main": "src/main.ts",
            "tsConfig": "src/tsconfig.app.json",
            "polyfills": "src/polyfills.ts",
            "assets": [
              "src/assets",
              "src/upload.php"
            ],
            "styles": [
              "node_modules/bootstrap/dist/css/bootstrap.css",
              "node_modules/primeng/resources/primeng.min.css",
              "node_modules/fullcalendar/dist/fullcalendar.min.css",
              "node_modules/quill/dist/quill.snow.css",
              "node_modules/font-awesome/css/font-awesome.min.css",
              "src/styles.scss"
            ],
            "scripts": [
              "node_modules/jquery/dist/jquery.js",
              "node_modules/popper.js/dist/umd/popper.js",
              "node_modules/bootstrap/dist/js/bootstrap.js",
              "node_modules/moment/moment.js",
              "node_modules/chart.js/dist/Chart.js",
              "node_modules/fullcalendar/dist/fullcalendar.js",
              "node_modules/quill/dist/quill.js"
            ]
          },
          "configurations": {
            "production": {
              "optimization": true,
              "outputHashing": "all",
              "sourceMap": false,
              "extractCss": true,
              "namedChunks": false,
              "aot": true,
              "extractLicenses": true,
              "vendorChunk": false,
              "buildOptimizer": true,
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ]
            }
          }
        },
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "avalon:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "avalon:build:production"
            }
          }
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "browserTarget": "avalon:build"
          }
        },
        "test": {
          "builder": "@angular-devkit/build-angular:karma",
          "options": {
            "main": "src/test.ts",
            "karmaConfig": "./karma.conf.js",
            "polyfills": "src/polyfills.ts",
            "tsConfig": "src/tsconfig.spec.json",
            "scripts": [
              "node_modules/jquery/dist/jquery.js",
              "node_modules/moment/moment.js",
              "node_modules/chart.js/dist/Chart.js",
              "node_modules/fullcalendar/dist/fullcalendar.js",
              "node_modules/quill/dist/quill.js"
            ],
            "styles": [
              "node_modules/primeng/resources/primeng.min.css",
              "node_modules/fullcalendar/dist/fullcalendar.min.css",
              "node_modules/quill/dist/quill.snow.css",
              "node_modules/font-awesome/css/font-awesome.min.css",
              "src/styles.scss"
            ],
            "assets": [
              "src/assets",
              "src/upload.php"
            ]
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": [
              "src/tsconfig.app.json",
              "src/tsconfig.spec.json"
            ],
            "exclude": [
              "**/node_modules/**"
            ]
          }
        }
      }
    },
    "avalon-e2e": {
      "root": "",
      "sourceRoot": "e2e",
      "projectType": "application",
      "architect": {
        "e2e": {
          "builder": "@angular-devkit/build-angular:protractor",
          "options": {
            "protractorConfig": "./protractor.conf.js",
            "devServerTarget": "avalon:serve"
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": [
              "e2e/tsconfig.e2e.json"
            ],
            "exclude": [
              "**/node_modules/**"
            ]
          }
        }
      }
    }
  },
  "defaultProject": "avalon",
  "schematics": {
    "@schematics/angular:component": {
      "prefix": "app",
      "styleext": "css"
    },
    "@schematics/angular:directive": {
      "prefix": "app"
    }
  }
}

如果你先暫時性將 avalon-e2e 的內容移除呢?

或是

 "avalon-e2e": {
      "root": "",
      "sourceRoot": "e2e",

更換成

 "avalon-e2e": {
      "root": "e2e/",

這樣就可以了 !!! 讚 !!

請問大大, 這原理是 ?

應該是 e2e 專案的路徑指錯地方了

Kevin ,謝謝你, 這麼快速又精確的回答

其實我對 e2e 測試, 完全沒有什麼概念 . 我就拿 Angular 當一個開發工具, 還沒想到 Testing 這個議題

不過,我好奇的是 e2e 測試的設定路徑

為什麼會跟

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

這個錯誤訊息, 有關係 ?

這中間的關聯與原理, 不知如何理解起 ?

這是 Angular CLI 工具的問題,不確定在升級的命令的動作在哪一個環節出錯了。
但如果是建立全新的專案是不會出現這個問題的

那個錯誤主要是找不到 NgModules 的問題.

所以就當作工具的 Bug 就好

謝謝 !!