0

cloné un proyecto el cuál es nuevo, así que esta desde cero. Hice un npm install y todo bien, ahora, cuándo ejecuta el comando ng add @angular/material me arroja este montón errores:

introducir la descripción de la imagen aquí

además, cuándo ejecuto ng serve me muestra este error:

introducir la descripción de la imagen aquí

Alguien sabe a que se deba esto?

Actualización:

Versión de Angular Cli:

introducir la descripción de la imagen aquí

Este es mi package.json antes de ejecutar npm install:

{
  "name": "angular",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.14",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.28",
    "@angular/cli": "~8.3.28",
    "@angular/compiler-cli": "~8.2.14",
    "@angular/language-service": "~8.2.14",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~7.0.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.5.3"
  }
}

Después de ejecutar npm install:

{
  "name": "angular",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.14",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.28",
    "@angular/cli": "~8.3.28",
    "@angular/compiler-cli": "~8.2.14",
    "@angular/language-service": "~8.2.14",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~7.0.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.5.3"
  }
}

4
  • Muestra el package.json, el que clonaste y el que quedó después del npm i el 3 abr. 2021 a las 16:50
  • @sgClaudia98 listo.
    – JulianProg
    el 3 abr. 2021 a las 17:02
  • @sgClaudia98 además, cuando intento ng serve también me muestra otro error, lo acabo de agregar a la pregunta también.
    – JulianProg
    el 3 abr. 2021 a las 17:21
  • Entonces eso es lo primero, lograr que no serve funcione. Luego material debe funcionar el 3 abr. 2021 a las 17:36

1 respuesta 1

2

Prueba lo siguiente en el proyecto clonado

  1. Borra node_modules y package.lock
  2. En package.json cambia todos los ^ por ~
  3. Npm i
  4. Ng serve

Si funciona... 5. ng add @angular/material@8.3.2

Explicación

Lo que pasó aquí fue que como el repo que clonaste tiene una versión vieja. Al dar npm i todo lo que tenga

^ puede realizar actualizaciones menores y de parches

~ puede realizar actualizaciones de parches

Muchas veces cuando actualizas una versión otro paquete o dependencia necesita actualizarse también, esto puede dar errores de breaking changes en el código existente. Por eso es que al corregir estás actualizaciones automáticas y limitar las solo a los parches ya no te salen los errores de paquetes con distinto número de versión o menor al requerido. También te busque el angular material que aparece en la doc para angular 8 y esa fue la versión que te compartí.

Saludos y buen día

4
  • Solo borraré package-lock, ya que al no hacer un npm i no tengo la carpeta node_modules, ya que es un repo clonado.
    – JulianProg
    el 3 abr. 2021 a las 17:33
  • Si ,me lo imaginé, pero por si acaso se quedaba de hacer rollback en el git el 3 abr. 2021 a las 17:34
  • Esto funcionó, podrías explicarme lo que se hizo? y por que de la forma común (haciendo un npm install ) no funcionaba y tenía esos errores ?
    – JulianProg
    el 3 abr. 2021 a las 18:15
  • @JulianProg Ya actualice con una explicación el 3 abr. 2021 a las 18:32

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.