Tidak dapat menemukan modul “@ angular-devkit / build-angular”

Setelah memperbarui ke Angular 6.0.1, saya mendapatkan kesalahan berikut ng serve:

Could not find module "@angular-devkit/build-angular" from "/home/Projects/myProjectName".
Error: Could not find module "@angular-devkit/build-angular" from "/home/Projects/myProjectName".
    at Object.resolve (/home/Projects/myProjectName/node_modules/@angular-devkit/core/node/resolve.js:141:11)
    at Observable.rxjs_1.Observable [as _subscribe] (/home/Projects/myProjectName/node_modules/@angular-devkit/architect/src/architect.js:132:40)

ng updatemengatakan semuanya beres. Menghapus node_modulesfolder dan npm installinstalasi baru juga tidak membantu.

Proyek saya didasarkan pada ng2-admin (versi Angular4) . Ini adalah dependecies package.json saya:

 "dependencies": {
    "@angular/animations": "^6.0.1",
    "@angular/common": "^6.0.1",
    "@angular/compiler": "^6.0.1",
    "@angular/core": "^6.0.1",
    "@angular/forms": "^6.0.1",
    "@angular/http": "^6.0.1",
    "@angular/platform-browser": "^6.0.1",
    "@angular/platform-browser-dynamic": "^6.0.1",
    "@angular/platform-server": "^6.0.1",
    "@angular/router": "^6.0.1",
    "@ng-bootstrap/ng-bootstrap": "1.0.0-alpha.26",
    "@ngx-translate/core": "^10.0.1",
    "@ngx-translate/http-loader": "^3.0.1",
    "amcharts3": "github:amcharts/amcharts3",
    "ammap3": "github:amcharts/ammap3",
    "angular-table": "^1.0.4",
    "angular2-csv": "^0.2.5",
    "angular2-datatable": "0.6.0",
    "animate.css": "3.5.2",
    "bootstrap": "4.0.0-alpha.6",
    "bower": "^1.8.4",
    "chart.js": "1.1.1",
    "chartist": "0.10.1",
    "chroma-js": "1.3.3",
    "ckeditor": "4.6.2",
    "core-js": "2.4.1",
    "easy-pie-chart": "2.1.7",
    "font-awesome": "4.7.0",
    "fullcalendar": "3.3.1",
    "google-maps": "3.2.1",
    "ionicons": "2.0.1",
    "jquery": "3.2.1",
    "jquery-slimscroll": "1.3.8",
    "leaflet": "0.7.7",
    "leaflet-map": "0.2.1",
    "lodash": "4.17.4",
    "ng2-ckeditor": "1.1.6",
    "ng2-completer": "^1.6.3",
    "ng2-handsontable": "^2.1.0-rc.3",
    "ng2-slim-loading-bar": "^4.0.0",
    "ng2-smart-table": "^1.0.3",
    "ng2-tree": "2.0.0-alpha.5",
    "ngx-uploader": "4.2.4",
    "normalize.css": "6.0.0",
    "roboto-fontface": "0.7.0",
    "rxjs": "^6.1.0",
    "rxjs-compat": "^6.1.0",
    "zone.js": "0.8.26"
  },
  "devDependencies": {
    "@angular/cli": "^6.0.1",
    "@angular/compiler-cli": "^6.0.1",
    "@types/fullcalendar": "2.7.40",
    "@types/jasmine": "2.5.38",
    "@types/jquery": "2.0.41",
    "@types/jquery.slimscroll": "1.3.30",
    "@types/lodash": "4.14.61",
    "@types/node": "6.0.69",
    "codelyzer": "3.0.1",
    "gh-pages": "0.12.0",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "3.2.0",
    "karma": "1.4.1",
    "karma-chrome-launcher": "2.0.0",
    "karma-cli": "1.0.1",
    "karma-coverage-istanbul-reporter": "0.2.0",
    "karma-jasmine": "1.1.0",
    "karma-jasmine-html-reporter": "0.2.2",
    "npm-run-all": "4.0.2",
    "protractor": "5.1.0",
    "rimraf": "2.6.1",
    "standard-changelog": "1.0.1",
    "stylelint": "7.10.1",
    "ts-node": "2.1.2",
    "tslint": "5.2.0",
    "tslint-eslint-rules": "4.0.0",
    "tslint-language-service": "0.9.6",
    "typescript": "^2.7.2",
    "typogr": "0.6.6",
    "underscore": "1.8.3",
    "wintersmith": "2.2.5",
    "wintersmith-sassy": "1.1.0"
  }

dan angular.json saya:

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "ng2-admin": {
      "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/favicon.ico"
            ],
            "styles": [
              "node_modules/roboto-fontface/css/roboto/sass/roboto-fontface.scss",
              "node_modules/normalize.css/normalize.css",
              "node_modules/font-awesome/scss/font-awesome.scss",
              "node_modules/ionicons/scss/ionicons.scss",
              "node_modules/bootstrap/scss/bootstrap.scss",
              "node_modules/leaflet/dist/leaflet.css",
              "node_modules/chartist/dist/chartist.css",
              "node_modules/fullcalendar/dist/fullcalendar.css",
              "node_modules/handsontable/dist/handsontable.full.css",
              "node_modules/ng2-slim-loading-bar/style.css",
              "src/app/theme/theme.scss",
              "src/styles.scss"
            ],
            "scripts": [
              "node_modules/jquery/dist/jquery.js",
              "node_modules/easy-pie-chart/dist/jquery.easypiechart.js",
              "node_modules/jquery-slimscroll/jquery.slimscroll.js",
              "node_modules/tether/dist/js/tether.js",
              "node_modules/bootstrap/dist/js/bootstrap.js",
              "node_modules/handsontable/dist/handsontable.full.js",
              "node_modules/chroma-js/chroma.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": "ng2-admin:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "ng2-admin:build:production"
            }
          }
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "browserTarget": "ng2-admin: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/easy-pie-chart/dist/jquery.easypiechart.js",
              "node_modules/jquery-slimscroll/jquery.slimscroll.js",
              "node_modules/tether/dist/js/tether.js",
              "node_modules/bootstrap/dist/js/bootstrap.js",
              "node_modules/handsontable/dist/handsontable.full.js",
              "node_modules/chroma-js/chroma.js"
            ],
            "styles": [
              "node_modules/roboto-fontface/css/roboto/sass/roboto-fontface.scss",
              "node_modules/normalize.css/normalize.css",
              "node_modules/font-awesome/scss/font-awesome.scss",
              "node_modules/ionicons/scss/ionicons.scss",
              "node_modules/bootstrap/scss/bootstrap.scss",
              "node_modules/leaflet/dist/leaflet.css",
              "node_modules/chartist/dist/chartist.css",
              "node_modules/fullcalendar/dist/fullcalendar.css",
              "node_modules/handsontable/dist/handsontable.full.css",
              "node_modules/ng2-slim-loading-bar/style.css",
              "src/app/theme/theme.scss",
              "src/styles.scss"
            ],
            "assets": [
              "src/assets",
              "src/favicon.ico"
            ]
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": [
              "src/tsconfig.app.json",
              "src/tsconfig.spec.json"
            ],
            "exclude": []
          }
        }
      }
    },
    "ng2-admin-e2e": {
      "root": "",
      "sourceRoot": "",
      "projectType": "application",
      "architect": {
        "e2e": {
          "builder": "@angular-devkit/build-angular:protractor",
          "options": {
            "protractorConfig": "./protractor.conf.js",
            "devServerTarget": "ng2-admin:serve"
          }
        },
        "lint": {
          "builder": "@angular-devkit/build-angular:tslint",
          "options": {
            "tsConfig": [
              "e2e/tsconfig.e2e.json"
            ],
            "exclude": []
          }
        }
      }
    }
  },
  "defaultProject": "ng2-admin",
  "schematics": {
    "@schematics/angular:component": {
      "prefix": "app",
      "styleext": "scss"
    },
    "@schematics/angular:directive": {
      "prefix": "app"
    }
  }
}

Instal @angular-devkit/build-angularsebagai dependensi dev. Paket ini baru diperkenalkan di Angular 6.0

npm install --save-dev @angular-devkit/build-angular

atau,

yarn add @angular-devkit/build-angular --dev

npm update

Itu bekerja seperti pesona.

untuk sudut 6 ke atas

Solusi untuk saya adalah

npm install

ng update

dan akhirnya

npm update

Perlu secara eksplisit mendapatkan devDependencies.

npm i --only=dev

Jika perintah berikut ini tidak berfungsi,

npm install --save-dev @angular-devkit/build-angular

kemudian pindah ke folder proyek dan jalankan perintah ini:

npm install --save @angular-devkit/build-angular

Semua jawaban di atas benar tetapi tidak bekerja untuk saya. Satu-satunya cara saya dapat membuat pekerjaan ini adalah dengan mengikuti langkah / perintah:

npm uninstall -g @angular/[email protected]
npm cache clean --force
npm install -g @angular/cli@latest
npm install node-sass -g
ng new MY_PROJECT_NAME
cp -r from_my_old_project to_new_MY_PROJECT_NAME

Untuk Angular 8

Instal NPM-check-update paket

Lari:

$ npm i npm-check-updates
$ ncu -u
$ npm install

Paket ini akan memperbarui semua paket dan menyelesaikan masalah ini

Perhatian: Setelah pembaruan Jika Anda menghadapi masalah ini:

GALAT dalam Kompiler Angular membutuhkan TypeScript> = 3.4.0 dan <3.6.0 tetapi 3.6.3 ditemukan sebagai gantinya.

lalu lari:

$ npm install [email protected]

Tautan Sumber

npm install Cukup ketik npm installdan jalankan. Kemudian proyek akan berjalan tanpa kesalahan. Atau bisa Anda gunakannpm install --save-dev @angular-devkit/build-angular

Berikut ini bekerja untuk saya. Sayangnya, tidak ada yang berhasil.

npm uninstall @angular-devkit/build-angular
npm install @angular-devkit/build-angular
ng update --all --allow-dirty --force

Coba yang ini.

npm install

npm update

if it's shows something like this. 

jalankan npm audit fixuntuk memperbaikinya, atau npm audituntuk detail

Lakukan itu!

Perintah berikut berfungsi:

npm install
ng update

-Anda dapat melihat pesan "Kami menganalisis paket Anda. Johnny dan semuanya tampaknya beres. Kerja bagus!"

npm update

Kemudian cobalah membangun dev

ng build 

Saya mendapat kesalahan dengan skrip jenis, diturunkan ke

npm install typescript@">=3.1.1 <3.2

ng build --prod 

Semua sukses dengan prod build.

Di bawah ini adalah kombinasi yang berfungsi

ng --version

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.11.0
@angular-devkit/build-angular     0.11.0
@angular-devkit/build-optimizer   0.11.0
@angular-devkit/build-webpack     0.11.0
@angular-devkit/core              7.1.0
@angular-devkit/schematics        7.1.0
@angular/cli                      7.1.0
@ngtools/webpack                  7.1.0
@schematics/angular               7.1.0
@schematics/update                0.11.0
rxjs                              6.3.3
typescript                        3.1.6
webpack                           4.23.1

Saya sudah mencoba semuanya di atas dan ini adalah cara tetap untuk saya:

-> Hapus folder node_modules.

-> Terminal -> instal npm.

Semoga ini bisa membantu!

Ketika kami menjalankan perintah like ng serve, ia menggunakan versi lokal @ angular / cli. Jadi, instal versi terbaru dari @ angular / cli secara lokal (tanpa flag -g). Kemudian perbarui cli menggunakan ng update @angular/cliperintah. Saya kira ini harus memperbaiki masalah. Terima kasih

Tautan ini dapat membantu Anda jika Anda memperbarui proyek sudut Anda https://update.angular.io/

Saya memiliki masalah yang sama dengan Angular 7. Hanya menjalankan perintah dan kesalahan berikut ini diselesaikan.

npm install --save-dev @angular-devkit/build-angular

npm install --save-dev @angular-devkit/build-angular@latest

memecahkannya untukku.

Cukup jalankan perintah berikut dan kesalahan telah terpecahkan

• ng update @angular/cli @angular/core
• npm uninstall @angular-devkit/build-angular

• npm install --save-dev @angular-devkit/build-angular

  jika kesalahan ini tidak dapat diselesaikan dengan perintah di atas sehingga Anda memperbarui versi simpul

  • npm perbarui npm -g

Hapus node_modulesfolder terlebih dahulu

kemudian Restart sistem

Lari npm install --save-dev @angular-devkit/build-angular

dan

Lari npm install

Saya berjuang dengan masalah yang sama beberapa menit yang lalu. Proyek saya dihasilkan menggunakan v 1.6.0 dari angular-cli.

1. npm update -g @angular/cli

2. editing my package.json changing the line
    "@angular/cli": "1.6.0",
      to
    "@angular/cli": "^1.6.0",

3. npm update

Saya harap bantuan saya efektif ツ

Coba ini dulu

npm install --save-dev @angular-devkit/build-angular

Jika beberapa kesalahan datang lagi untuk paket yang hilang coba

npm install

Itu bekerja untuk saya, komit dan kemudian:

ng update @angular/cli @angular/core
npm install --save-dev @angular/cli@latest

Saya memiliki masalah yang sama hari ini, setelah memutakhirkan simpul dari v9 ke v10.
Lingkungan saya diatur oleh buruh pelabuhan dan saya harus menghapus perintah ini dari DockerFile saya:

npm link @angular/cli

Itu menciptakan symlink ke direktori di mana node diinstal.
Saya kira angular/climodul di dalamnya tidak memiliki versi yang sama dengan yang ada di dir node_modules proyek saya, dan ini menyebabkan masalah.

Kesalahan ini umumnya terjadi ketika proyek sudut tidak mengkonfigurasi sepenuhnya.

Ini akan bekerja

npm install --save-dev @angular-devkit/build-angular

npm install

menjalankan berikut ini bekerja untuk saya npm audit fix --force

tambahkan di @angular-devkit/build-angularbawah dependensi dev Anda dan itu akan berhasil, atau Anda juga dapat mengeksekusi

npm install --save-dev @angular-devkit/build-angular

Hapus package-lock.json dan lakukan instalasi npm lagi. Seharusnya memperbaiki masalah.

** Perbaikan ini lebih cocok ketika Anda membuat aplikasi Angular 6 menggunakan ng baru dan setelah menginstal dependensi lain Anda menemukan kesalahan ini.

Dalam kasus saya, masalahnya adalah karena tidak adanya dependensi. Mengapa dependensi tidak ada, karena saya lupa menelepon:

npm instal

Setelah memanggil perintah di atas, semua dependensi yang diperlukan dimuat dalam node_modules, dan itu tidak ada masalah lagi

Jalankan perintah di bawah ini pada CLI Anda:

• npm instal

• Hapus node_modules.
• Bersihkan cache menggunakan'npm cache clean --verify '.
• Dan kemudian npm instal lagi.

Bekerja seperti pesona bagi saya.

Coba ini. Ini berhasil untuk saya

npm uninstall -g @angular/cli
npm cache verify
npm install -g @angular/cli@next

Sayangnya, tidak ada solusi yang disediakan yang bekerja dengan sempurna untuk saya, tetapi jawaban grepit menginspirasi saya untuk melakukan langkah-langkah berikut. Saya menghapus instalan node.js melalui OS saya (Windows 10) dan menginstalnya lagi. Kemudian dipasang Angular CLI. Kemudian membuat proyek baru, dan menyalin file src proyek lama saya ke yang baru ini dan kesalahan hilang.

Berikut instruksinya:

1. Hapus instalan node.js melalui OS Anda dan instal kembali
2. npm install -g @angular/cli
3. Ganti nama proyek Anda ke YOUR_PROJECT_NAME.old
4. ng new YOUR_PROJECT_NAME
5. Jalankan proyek hello world ini ( ng serve) untuk memastikan bahwa Anda tidak akan mendapatkan kesalahan.
6. xcopy YOUR_PROJECT_NAME.old\src\*.* YOUR_PROJECT_NAME\src /s
   Ini adalah salinan versi Windows, ubah berdasarkan OS Anda sendiri.