tutorial - No se pudo encontrar el módulo “@ angular-devkit/build-angular”
uninstall angular cli (29)
Solución simple
Golpee abajo para comentar solo para corregir este error
npm install --save-dev @angular-devkit/build-angular
Después de actualizar a Angular 6.0.1, obtengo el siguiente error en el
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 update
dice que todo está en orden.
La eliminación de la carpeta node_modules y una instalación nueva de
npm install
tampoco ayudaron.
Mi proyecto se basa en [ng2-admin (versión Angular4)]. ( https://github.com/akveo/ngx-admin ) Aquí está mi paquete. Dependencias dependientes:
"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"
}
y mi 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"
}
}
}
Cuando ejecutamos comandos como
ng serve
, usa la versión local de @ angular / cli.
Así que primero instale la última versión de @ angular / cli localmente (sin el indicador -g).
Luego actualice el comando cli usando
ng update @angular/cli
.
Creo que esto debería solucionar el problema.
Gracias
Este enlace puede ayudarlo si está actualizando su proyecto angular https://update.angular.io/
Desafortunadamente, ninguna de las soluciones proporcionadas funcionó perfectamente para mí, pero la respuesta de grepit me inspiró a hacer los siguientes pasos. Desinstalé node.js a través de mi sistema operativo (Windows 10) y lo instalé de nuevo. Luego instaló Angular CLI. Luego creó un nuevo proyecto y copió el archivo src de mi proyecto anterior en este nuevo y el error desapareció.
Aquí están las instrucciones:
- Desinstale node.js a través de su sistema operativo y vuelva a instalarlo
-
npm install -g @angular/cli
- Cambie el nombre de su proyecto a YOUR_PROJECT_NAME.old
-
ng new YOUR_PROJECT_NAME
-
Ejecute este proyecto hello world (
ng serve
) para asegurarse de que no recibirá el error. -
xcopy YOUR_PROJECT_NAME.old/src/*.* YOUR_PROJECT_NAME/src /s
Esta es la versión de copia de Windows, cámbiela según su propio sistema operativo.
Elimine package-lock.json y vuelva a instalar npm. Debería arreglar el problema.
** Esta solución es más adecuada cuando ha creado la aplicación Angular 6 usando ng new y después de instalar otras dependencias, encuentra este error.
En mi caso, el problema es porque faltan dependencias. Por qué faltan las dependencias, porque me he olvidado de llamar:
npm instalar
Después de llamar al comando anterior, todas las dependencias necesarias se cargan en node_modules, y eso ya no es un problema
Eso me funciona, comprométete y luego:
ng update @angular/cli @angular/core
npm install --save-dev @angular/cli@latest
Este error generalmente ocurre cuando el proyecto angular no se configuró completamente.
Esto funcionara
npm install --save-dev @angular-devkit/build-angular
npm install
Estoy enfrentando el mismo problema desde hace 2 días.
ng -v :6.0.8
node -v :8.11.2
npm -v :6.1.0
Asegúrate de que estás en la carpeta donde está instalado
angular.json
.
Entra en eso y escribe
ng serve
.
Si el problema persiste, solo tiene dependencias instaladas en los
node_modules
.
Escriba lo siguiente, y funcionará:
npm i --only=dev
Instale
@angular-devkit/build-angular
como dependencia de dev.
Este paquete se acaba de presentar en Angular 6.0
npm install --save-dev @angular-devkit/build-angular
o,
yarn add @angular-devkit/build-angular --dev
Los siguientes comandos funcionan:
npm install
ng update
-Puede ver el mensaje "Analizamos su paquete.json y todo parece estar en orden. ¡Buen trabajo!"
npm update
Entonces prueba dev build
ng build
Recibí el error con el script de tipo, degradado a
npm install typescript@">=3.1.1 <3.2
ng build --prod
Todo el éxito con la construcción prod.
A continuación se muestra la combinación de trabajo.
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
Luché con el mismo problema hace un minuto. Mi proyecto fue generado usando la v 1.6.0 de 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
Espero que mi ayuda sea efectiva
Necesidad de obtener explícitamente devDependencies.
npm i --only=dev
Prueba este.
npm install
npm update
if it''s shows something like this.
ejecute
npm audit fix
para corregirlos, onpm audit
para obtener detalles
¡Haz eso!
Prueba esto primero
npm install --save-dev @angular-devkit/build-angular
Si algún error viene de nuevo por paquetes perdidos, intente
npm install
Prueba esto. Funciono para mi
npm uninstall -g @angular/cli
npm cache verify
npm install -g @angular/cli@next
Si el siguiente comando no funciona,
npm install --save-dev @angular-devkit/build-angular
luego muévase a la carpeta del proyecto y ejecute este comando:
npm install --save @angular-devkit/build-angular
Si la versión
npm
es antigua, intente ejecutar el siguiente comando:
npm i npm@latest -g
Simplemente ejecute el siguiente comando y se solucionó el error
-
ng update @angular/cli @angular/core
-
npm uninstall @angular-devkit/build-angular
-
npm install --save-dev @angular-devkit/build-angular
si este error no se pudo resolver con el comando anterior, entonces actualiza la versión del nodo
- actualización de npm npm -g
Todas las respuestas anteriores son correctas, pero no funcionaron para mí. La única forma en que pude hacer este trabajo fue siguiendo los pasos / comandos:
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
Tuve el mismo problema con Angular 7. Simplemente ejecuté el siguiente comando y se resolvió el error.
npm install --save-dev @angular-devkit/build-angular
Tuve el mismo problema hoy, después de actualizar el nodo de v9 a v10.
Mi entorno está configurado por la ventana acoplable y tuve que eliminar este comando de mi DockerFile:
npm link @angular/cli
Crea un enlace simbólico al directorio donde está instalado el nodo.
Supongo que el módulo
angular/cli
en él no tiene la misma versión que la del directorio node_modules de mi proyecto, y esto causa el problema.
agregue
@angular-devkit/build-angular
bajo su dependencia de dev y funcionará, o también puede ejecutar
npm install --save-dev @angular-devkit/build-angular
la ejecución de lo siguiente funcionó para mí
npm audit fix --force
para angular 6 y superior
La solución de trabajo para mí fue
npm install
ng update
y finalmente
npm update
npm install
Simplemente escriba
npm install
y ejecute. Luego, el proyecto se ejecutará sin errores.
O puede usar
npm install --save-dev @angular-devkit/build-angular
npm install --save-dev @angular-devkit/build-angular@latest
lo resolvió por mi
npm update
Funcionó a las mil maravillas.
- Eliminar los node_modules.
- Borre la memoria caché utilizando ''npm cache clean --verify''.
- Y luego npm instalar de nuevo.
Funciona como un encanto para mí.