Nie można znaleźć modułu „@ angular-devkit / build-angular”

452

Po aktualizacji do Angular 6.0.1 pojawia się następujący błąd 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 updatemówi, że wszystko jest w porządku. Usunięcie node_modulesfolderu i świeża npm installinstalacja również nie pomogły.

Mój projekt oparty jest na ng2-admin (wersja Angular4) . Oto moje zależności w pakiecie.json:

 "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"
  }

i mój angular.json:

{
  "$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"
    }
  }
}
ForestG
źródło
Dla Angulara 8 Po prostu zainstaluj pakiet NCM npm [$ npm i -g npm-check-updates] i zaktualizuj wszystko sprawdź tutaj, aby uzyskać więcej informacji freakyjolly.com/how-to-update-local-angular-cli-version
Code Spy

Odpowiedzi:

737

Zainstaluj @angular-devkit/build-angularjako zależność deweloperską. Ten pakiet został niedawno wprowadzony w Angular 6.0

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

lub,

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

Ritwick Dey
źródło
11
Mam ten sam problem. Niestety twoje rozwiązanie nie działało dla mnie. Czy masz jakieś inne sugestie?
subzerodeluxe
Dokładnie ten sam błąd? A plik konfiguracyjny? czy są takie same jak to pytanie?
Ritwick Dey
Tak. Cóż, trochę więcej zgłębiałem w tej sprawie. Okazuje się, że działa dobrze na moim Macu Mini, więc prawdopodobnie będzie to miało związek z konfiguracją mojego Węzła w systemie Windows.
subzerodeluxe
2
Uaktualnienie do wersji kątowej 7 - zaakceptowana odpowiedź naprawiła błąd (ocenił), ale ogólnie nie rozwiązała problemu z uaktualnieniem. To zrobiło stackoverflow.com/a/51592138/852806
HockeyJ
4
Dzięki za to. Właśnie natrafiłem na ten problem podczas próby korzystania z samouczka Angular: angular.io/guide/quickstart - wygląda na to, że ktoś zapomniał zaktualizować dokumentację?
Dan King
168
npm update

Działa jak urok.

Ajay Takur
źródło
3
Przeniosłem się na nową maszynę w połowie samouczka poświęconego wędrówce bohaterów i wyciągnąłem częściowo wypieczoną pracę z kontroli źródła. To naprawiło to.
Heliac
Po utworzeniu oddziału w projekcie mojego współpracownika dostałem komunikat o błędzie. To naprawiło to. Dziękuję Ci.
Moni,
Nic „na wpół upieczone” o niezatwierdzeniu node modulesfolderu. To po prostu odbudowuje moduły węzłów na podstawie pliku package.json. Jest to zupełnie normalna rzecz, gdy sprawdzasz nowe rozwiązanie.
Liam
2
Rozwiązuje wszystkie zależności :). +1
Hammad Sajid
Mogą istnieć dodatkowe pakiety, które są nieaktualne. Uruchom, ng update --allaby spróbować zaktualizować wszystkie jednocześnie.
Samotny
86

dla kąta 6 i więcej

Rozwiązaniem dla mnie było

npm install

ng update

i w końcu

npm update

Martwy człowiek
źródło
Kiedy robię aktualizację ng, otrzymałem kilka wiadomości o kilku potrzebnych konkretnych aktualizacjach. Nazwa Wersja Polecenie do aktualizacji --------------------------------------------- ----------------------------------- @ kątowy / rdzeń 4.4.7 -> 8.2.4 ng aktualizacja @ angular / core @ ngrx / store 2.2.3 -> 8.3.0 ng update @ ngrx / store rxjs 5.5.12 -> 6.5.3 ng update rxjs
Aggie Jon z 87
3
Dzięki @ user9964622, to rozwiązanie działało dla mnie.
Głęboki
@Deep Cieszę się, że mogłem pomóc, wesołego kodowania
The Dead Man
15

Jeśli następujące polecenie nie działa,

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

następnie przejdź do folderu projektu i uruchom następujące polecenie:

npm install --save @angular-devkit/build-angular
Murugaraju Perumalla
źródło
npm install --save @ angular-devkit / build-angular działał dla mnie, ale jedynym problemem było to, że próbowałem uruchomić to polecenie z wiersza polecenia, który nie został uruchomiony jako administrator, i wszedłem, aby wykonać to polecenie, które nie było wyświetlane każdy błąd nic tylko kursor był w stanie oczekiwania, po prostu uruchamiam cmd z adminem w nim działało. Dzięki
asifaftab87,
14

Wszystkie powyższe odpowiedzi są poprawne, ale dla mnie nie działały. Jedynym sposobem, w jaki mogłem wykonać tę pracę, było wykonanie następujących kroków / poleceń:

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
grepit
źródło
Jeśli próbujesz zbudować bibliotekę, użyj ng new MY_PROJECT_NAME --create-application=falsepolecenia od ostatniego do ostatniego. Miałem ten błąd podczas próby zbudowania biblioteki. --create-application=falseFlaga zapobiega ciągnąc niepotrzebnych zależności. ( angular.io/guide/creating-libraries#getting-started )
VSO
1
pracował dla mnie po wyczyszczeniu pamięci podręcznej npm i ponownej instalacji
Braj
10

Dla Angulara 8

Zainstaluj pakiet npm-check-updates

Biegać:

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

Ten pakiet zaktualizuje wszystkie pakiety i rozwiąże ten problem

Uwaga: Po aktualizacji Jeśli napotkasz ten problem:

BŁĄD w Kompilatorze kątowym wymaga TypeScript> = 3.4.0 i <3.6.0, ale zamiast tego znaleziono 3.6.3.

następnie uruchomić:

$ npm install [email protected]

Link źródłowy

Code Spy
źródło
„ncu” nie jest rozpoznawane jako polecenie wewnętrzne lub zewnętrzne, program operacyjny lub plik wsadowy.
VivekDev
8

npm install Po prostu wpisz npm installi uruchom. Następnie projekt będzie działał bez błędów. Lub możesz użyćnpm install --save-dev @angular-devkit/build-angular

Thisuri
źródło
8

Poniższe działało dla mnie. Niestety nic innego nie zrobiło.

npm uninstall @angular-devkit/build-angular
npm install @angular-devkit/build-angular
ng update --all --allow-dirty --force
Ε Г И І И О
źródło
Miałem komunikat z informacją - nie zainstalowano brudnego brudu. Ale zaktualizowałem moje rzeczy.
Garth Baker
6

Spróbuj tego.

npm install

npm update

if it's shows something like this. 

uruchom, npm audit fixaby je naprawić lub npm auditpo szczegóły

Zrób to!

Elshan
źródło
1
A kiedy to robisz, NPM mówi: „Mam nadzieję, że wiesz, co robisz”. To dało mi dziwaków.
Ε Г И І И О
1
głosował, ponieważ pomógł - choć tylko częściowo. Po wykonaniu tej czynności nadal brakowało niektórych zależności równorzędnych, które instaluję zgodnie z tym pomysłem: stackoverflow.com/a/51063840/2995907
dingalapadum
6

Działa następujące polecenia:

npm install
ng update

-Możesz zobaczyć komunikat „Przeanalizowaliśmy plik package.json i wszystko wydaje się być w porządku. Dobra robota!”

npm update

Następnie wypróbuj dev build

ng build 

Wystąpił błąd ze skryptem typu, obniżony do

npm install typescript@">=3.1.1 <3.2

ng build --prod 

Cały sukces dzięki kompilacji prod.

Poniżej znajduje się kombinacja robocza

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
Pushpinder Singh
źródło
6

Próbowałem wszystkiego powyżej i jest to dla mnie ustalony sposób:

-> Usuń folder node_modules.

-> Terminal -> instalacja npm.

Mam nadzieję, że to pomogło!

Fes Nguyen
źródło
4

Kiedy uruchamiamy takie polecenia ng serve, używa lokalnej wersji @ angular / cli. Więc najpierw zainstaluj najnowszą wersję @ angular / cli lokalnie (bez flagi -g). Następnie zaktualizuj cli za pomocą ng update @angular/clipolecenia. Myślę, że to powinno rozwiązać problem. Dzięki

Ten link może ci pomóc, jeśli aktualizujesz swój projekt kątowy https://update.angular.io/

Tibin Thomas
źródło
4

Miałem ten sam problem z Angularem 7. Właśnie wykonałem następujące polecenie i błąd został rozwiązany.

npm install --save-dev @angular-devkit/build-angular
Chamila Maddumage
źródło
4
npm install --save-dev @angular-devkit/build-angular@latest

rozwiązał to dla mnie.

Lexy Feito
źródło
4

Wystarczy wykonać następujące polecenie i błąd został rozwiązany

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

    jeśli tego błędu nie można rozwiązać za pomocą powyższego polecenia, więc zaktualizuj wersję węzła

    • aktualizacja npm npm -g
Rajnikant Lodhi
źródło
4

Najpierw usuń node_modulesfolder

następnie zrestartuj system

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

i

Biegać npm install

Pullat Junaid
źródło
3

Jeszcze minutę temu zmagałem się z tym samym problemem. Mój projekt został wygenerowany przy użyciu wersji 1.6.0 programu 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

Mam nadzieję, że moja pomoc będzie skuteczna ツ


źródło
1
Nie ma to nic wspólnego z niemożnością znalezienia modułu. oznacza to po prostu, że moduł kątowy cli zostanie zaktualizowany dla dowolnej wersji 1.6.x
SanSolo
3

Spróbuj tego najpierw

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

Jeśli pojawi się jakiś błąd dotyczący brakujących pakietów, spróbuj

npm install
Sudheer Muhammed
źródło
3

To działa dla mnie, zatwierdzaj, a następnie:

ng update @angular/cli @angular/core
npm install --save-dev @angular/cli@latest
Andrey
źródło
3

Miałem dzisiaj ten sam problem, po aktualizacji węzła z wersji 9 do wersji 10.
Moje środowisko jest ustawiane przez okno dokowane i musiałem usunąć to polecenie z mojego pliku DockerFile:

npm link @angular/cli

Tworzy dowiązanie symboliczne do katalogu, w którym zainstalowany jest węzeł. Wydaje
mi się, że angular/climoduł w nim nie ma takiej samej wersji jak ta w katalogu node_modules mojego projektu, a to powoduje problem.

v.nivuahc
źródło
2

Ten błąd występuje zwykle, gdy projekt kątowy nie został całkowicie skonfigurowany.

To zadziała

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

npm install
Kshitij Shukla
źródło
0

uruchomienie następujących działało dla mnie npm audit fix --force

Geared4IT
źródło
0

dodaj @angular-devkit/build-angularpod swoją zależność od deweloperów i będzie działać, lub możesz także wykonać

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

Mohit Jain
źródło
0

Usuń pakiet-lock.json i ponownie zainstaluj npm. To powinno rozwiązać problem.

** Ta poprawka jest bardziej odpowiednia, gdy utworzysz aplikację Angular 6 za pomocą nowej aplikacji i po zainstalowaniu innych zależności znajdziesz ten błąd.

Rut Shah
źródło
0

W moim przypadku przyczyną jest brak zależności. Dlaczego brakuje zależności, ponieważ zapomniałem zadzwonić:

instalacja npm

Po wywołaniu powyższego polecenia wszystkie wymagane zależności są ładowane do modułów node_module, i to już nie jest problem

Chi Cuong Le
źródło
0

Rozwiązanie

Wykonaj poniżej polecenia na swoim CLI:

  • instalacja npm
Abdullah Pariyani
źródło
0
  • Usuń moduły_węzła.
  • Wyczyść pamięć podręczną, używając opcji „czyszczenie pamięci podręcznej na minutę - weryfikacja”.
  • A potem npm zainstaluj ponownie.

Dla mnie działa jak urok.

Arslan Mir
źródło
0

Spróbuj tego. To zadziałało dla mnie

npm uninstall -g @angular/cli
npm cache verify
npm install -g @angular/cli@next
Dinesh Shaw
źródło
@next da ci beta
Brent
0

Niestety żadne z dostarczonych rozwiązań nie działało idealnie dla mnie, ale odpowiedź grepit zainspirowała mnie do wykonania następujących kroków. Odinstalowałem node.js przez mój system operacyjny (Windows 10) i ponownie go zainstalowałem. Następnie zainstalowano Angular CLI. Następnie utworzyłem nowy projekt i skopiowałem plik src mojego starego projektu do tego nowego i błąd zniknął.

Oto instrukcje:

  1. Odinstaluj node.js za pomocą systemu operacyjnego i zainstaluj go ponownie
  2. npm install -g @angular/cli
  3. Zmień nazwę projektu na YOUR_PROJECT_NAME.old
  4. ng new YOUR_PROJECT_NAME
  5. Uruchom ten projekt hello world ( ng serve), aby upewnić się, że nie wystąpi błąd.
  6. xcopy YOUR_PROJECT_NAME.old\src\*.* YOUR_PROJECT_NAME\src /s
    To jest wersja kopii systemu Windows, zmień ją w oparciu o własny system operacyjny.
Ahmad
źródło