Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

1.8K
Views
error NG6002: aparece en NgModule.imports de AppModule, pero no se pudo resolver en una clase NgModule

Primera vez que uso firestore y recibo este error. Parece ser un problema con Ivy, según mi investigación. No tengo mucha experiencia modificando tsconfig.app.json, que es la dirección a la que me han señalado, siguiendo otras respuestas.

Lo único que pude modificar del proyecto original fue usar Angular Fire 6 en lugar de 5, que había hecho inicialmente para seguir un tutorial.

Aquí está paquete.json:

 { "name": "language", "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": "~9.0.1", "@angular/cdk": "^9.0.0", "@angular/common": "~9.0.1", "@angular/compiler": "~9.0.1", "@angular/core": "~9.0.1", "@angular/fire": "^6.0.0-rc.1", "@angular/flex-layout": "^9.0.0-beta.29", "@angular/forms": "~9.0.1", "@angular/material": "^9.0.0", "@angular/platform-browser": "~9.0.1", "@angular/platform-browser-dynamic": "~9.0.1", "@angular/router": "~9.0.1", "firebase": "^7.8.2", "rxjs": "~6.5.4", "rxjs-compat": "^6.5.4", "tslib": "^1.10.0", "zone.js": "~0.10.2" }, "devDependencies": { "@angular-devkit/build-angular": "~0.900.2", "@angular/cli": "~9.0.2", "@angular/compiler-cli": "~9.0.1", "@angular/language-service": "~9.0.1", "@types/node": "^12.11.1", "@types/jasmine": "~3.3.8", "@types/jasminewd2": "~2.0.3", "codelyzer": "^5.1.2", "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": "~5.4.0", "ts-node": "~7.0.0", "tslint": "~5.15.0", "typescript": "~3.7.5", "@angular-devkit/architect": "^0.900.0-0 || ^0.900.0", "firebase-tools": "^7.12.1", "fuzzy": "^0.1.3", "inquirer": "^6.2.2", "inquirer-autocomplete-prompt": "^1.0.1" } }

angular.json

 { "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "version": 1, "newProjectRoot": "projects", "projects": { "language": { "projectType": "application", "schematics": { "@schematics/angular:component": { "style": "scss" } }, "root": "", "sourceRoot": "src", "prefix": "app", "architect": { "build": { "builder": "@angular-devkit/build-angular:browser", "options": { "outputPath": "dist/language", "index": "src/index.html", "main": "src/main.ts", "polyfills": "src/polyfills.ts", "tsConfig": "tsconfig.app.json", "aot": true, "assets": [ "src/favicon.ico", "src/assets" ], "styles": [ "./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css", "src/styles.scss" ], "scripts": [] }, "configurations": { "production": { "fileReplacements": [ { "replace": "src/environments/environment.ts", "with": "src/environments/environment.prod.ts" } ], "optimization": true, "outputHashing": "all", "sourceMap": false, "extractCss": true, "namedChunks": false, "extractLicenses": true, "vendorChunk": false, "buildOptimizer": true, "budgets": [ { "type": "initial", "maximumWarning": "2mb", "maximumError": "5mb" }, { "type": "anyComponentStyle", "maximumWarning": "6kb", "maximumError": "10kb" } ] } } }, "serve": { "builder": "@angular-devkit/build-angular:dev-server", "options": { "browserTarget": "language:build" }, "configurations": { "production": { "browserTarget": "language:build:production" } } }, "extract-i18n": { "builder": "@angular-devkit/build-angular:extract-i18n", "options": { "browserTarget": "language:build" } }, "test": { "builder": "@angular-devkit/build-angular:karma", "options": { "main": "src/test.ts", "polyfills": "src/polyfills.ts", "tsConfig": "tsconfig.spec.json", "karmaConfig": "karma.conf.js", "assets": [ "src/favicon.ico", "src/assets" ], "styles": [ "./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css", "src/styles.scss" ], "scripts": [] } }, "lint": { "builder": "@angular-devkit/build-angular:tslint", "options": { "tsConfig": [ "tsconfig.app.json", "tsconfig.spec.json", "e2e/tsconfig.json" ], "exclude": [ "**/node_modules/**" ] } }, "e2e": { "builder": "@angular-devkit/build-angular:protractor", "options": { "protractorConfig": "e2e/protractor.conf.js", "devServerTarget": "language:serve" }, "configurations": { "production": { "devServerTarget": "language:serve:production" } } }, "deploy": { "builder": "@angular/fire:deploy", "options": {} } } } }, "defaultProject": "language" }

tsconfig.app.json

 { "extends": "./tsconfig.json", "compilerOptions": { "outDir": "./out-tsc/app", "types": [], }, "files": [ "src/main.ts", "src/polyfills.ts" ], "include": [ "src/**/*.d.ts" ], "exclude": [ "src/test.ts", "src/**/*.spec.ts" ] }

¡Gracias!

over 4 years ago · Santiago Trujillo
32 answers
Answer question

0

Se solucionó al excluirse de Ivy según la documentación.

https://angular.io/guide/ivy

Cambie tsconfig.app.json para excluirse de Ivy.

 "enableIvy": false
over 4 years ago · Santiago Trujillo Report

0

Su módulo aún no está cargado por Angular Server en node ng serve , así que reinicie su servidor para que el servidor cargue el módulo que acaba de agregar en @NgModule app.module.ts

over 4 years ago · Santiago Trujillo Report

0

Esto funciona para mí:

1) Detener el servidor ng

2) Reinstale su paquete

 npm install your-package-name

3) Ejecutar todo de nuevo

 ng serve
over 4 years ago · Santiago Trujillo Report

0

He probado todas las respuestas aquí, pero ninguna funcionó para mí. Así que decidí cambiar el archivo angular.js . hay una opción aot que es cierto. ¡entonces cambié eso a falso y el error desapareció!

 "options": { "outputPath": "dist/DateMeUI", "index": "src/index.html", "main": "src/main.ts", "polyfills": "src/polyfills.ts", "tsConfig": "tsconfig.app.json", "aot": false, // here you have to change "assets": [ "src/favicon.ico", "src/assets" ], "styles": [ "src/styles.css" ], "scripts": [] },

Sin embargo, obtuve que hay 'tsconfig.app.json' que no pude encontrar en mi proyecto (tal vez tenga que agregar esto manualmente) con este archivo, puede configurar "enableIvy": false como otros lo mencionan . tsconfig.app.json

over 4 years ago · Santiago Trujillo Report

0

npm cache clean --force -> limpiar el caché puede resolver el problema.

over 4 years ago · Santiago Trujillo Report

0

Este problema se solucionará agregando el script posterior a la postinstall a continuación en su package.json .

Se ejecutará después de una instalación de npm.

 "scripts": { "postinstall": "ngcc" }

Publique agregando el código anterior, ejecute npm install

Esto funciona para mí cuando actualizo a Angular 9+

over 4 years ago · Santiago Trujillo Report

0

Este error se muestra cuando agrega la declaración del componente en imports: [] en lugar de las declarations: [] , por ejemplo:

 declarations: [ AppComponent, ], imports: [ BrowserModule, AppRoutingModule, SomeComponent <-----------wrong ],
over 4 years ago · Santiago Trujillo Report

0

Trabaja para mi

angular.json

 "aot": false
over 4 years ago · Santiago Trujillo Report

0

esto funciona para mi

  1. Detener el servidor ng (ctrl+c)

  2. Corre de nuevo

     npm start / ng serve --open
over 4 years ago · Santiago Trujillo Report

0

Recibí este error cuando cometí el error estúpido de importar MatSnackBar en lugar de MatSnackBarModule en app.module.ts .

over 4 years ago · Santiago Trujillo Report

0

simplemente cambio mi importación de importación de { AngularFirestore} from '@angular/fire/firestore'; para import { AngularFirestoreModule } from '@angular/fire/firestore';

y esta funcionando bien

over 4 years ago · Santiago Trujillo Report

0

Simplemente vaya a su tsconfig.app.json en su proyecto y elimínelo todo.

y copie el código a continuación y péguelo. Resolverá tu problema :)

 /* To learn more about this file see: https://angular.io/config/tsconfig. */ { "extends": "./tsconfig.json", "compilerOptions": { "outDir": "./out-tsc/app", "types": [], }, "files": [ "src/main.ts", "src/polyfills.ts" ], "include": [ "src/**/*.d.ts" ], "angularCompilerOptions": { "enableIvy": false } }
over 4 years ago · Santiago Trujillo Report

0

Cometí un error al agregar un service en la matriz de imports en lugar de la matriz de providers .

 @NgModule({ imports: [ MyService // wrong here ], providers: [ MyService // should add here ] }) export class AppModule { }

Angular dice que necesita agregar Injectables a la matriz providers .

over 4 years ago · Santiago Trujillo Report

0

Me enfrenté al mismo problema en Ubuntu porque el directorio de la aplicación Angular tenía permiso de root . Cambiar la propiedad al usuario local resolvió el problema para mí.

 $ sudo -i $ chown -R <username>:<group> <ANGULAR_APP> $ exit $ cd <ANGULAR_APP> $ ng serve
over 4 years ago · Santiago Trujillo Report

0

Para mí estaba trabajando bajo Ubuntu

El error desapareció si uso sudo con ng

 sudo ng build sudo ng serve

Una mejor solución es otorgar al usuario actual los permisos necesarios en la carpeta actual usando el siguiente comando:

 sudo chown -R `whoami` ./

Si lo hace, le permitirá ejecutar comandos ng sin Sudo.

over 4 years ago · Santiago Trujillo Report

0

Esto también puede ocurrir cuando se usa una importación incorrecta (por ejemplo, cuando se usa la importación automática). tomemos MatTimePickerModule como ejemplo. Esto dará un mensaje de error similar al descrito en la pregunta:

 import { NgxMatTimepickerModule } from '@angular-material-components/datetime-picker/lib/timepicker.module';

En cambio, esto debería ser

 import { NgxMatTimepickerModule } from '@angular-material-components/datetime-picker';
over 4 years ago · Santiago Trujillo Report

0

A veces, cuando cambia/actualiza @NgModule en su proyecto, los proyectos se compilan pero los cambios no se reflejan. Por lo tanto, reinicie una vez para obtener los resultados esperados si no los obtiene. ng servir

over 4 years ago · Santiago Trujillo Report

0

Lo que me solucionó fue hacer coincidir la versión del material angular y el adaptador con la versión más baja de otro módulo angular. Luego reinstalado y vuelto a ejecutar.

 "@angular-devkit/schematics": "^10.1.2", "@angular/animations": "^10.1.2", "@angular/cdk": "^10.2.1", "@angular/common": "10.1.2", "@angular/compiler": "10.1.2", "@angular/core": "10.1.2", "@angular/forms": "10.1.2", "@angular/localize": "^10.1.2", "@angular/material": "^10.2.1", "@angular/material-moment-adapter": "^10.2.1", "@angular/platform-browser": "10.1.2", "@angular/platform-browser-dynamic": "10.1.2", "@angular/router": "10.1.2",

Como puede ver, mi cdk era 10.2.1 y mi material también era 10.2.1. Vi que la versión más baja utilizada era 10.1.2, así que cambié las versiones:

 "@angular/material": "^10.1.2", (was 10.2.1) "@angular/material-moment-adapter": "^10.1.2", (was 10.2.1)

a 10.1.2, ejecutó "npm install" y luego "ng serve", y se compiló correctamente.

over 4 years ago · Santiago Trujillo Report

0

En mi caso, resolví esto configurando "strictTemplates" nuevamente en falso en tsconfig.json

 { "compilerOptions": { // ... }, "angularCompilerOptions": { "strictTemplates": false } }

Anteriormente configuré esto en verdadero para evitar que se mostrara una ventana emergente de VStudio:

ingrese la descripción de la imagen aquí

over 4 years ago · Santiago Trujillo Report

0

También sucede cuando importa algunos componentes de tapete que no se usan en ninguna parte de sus componentes.

  • si tiene todos los componentes del tapete importados en su app.module.ts , ha importado algunos componentes del tapete y no ha usado ninguno de los componentes en las matrices de importación y exportación en app.module.ts , lo que significa que no hay problemas, no habrá errores, funcionará bien.

  • si crea un módulo de funciones para eso, digamos con ng gm material , esto creará el nombre de archivo material.module.ts .

  • ahora tenemos que copiar todas las declaraciones de importación de mat al módulo de funciones recién creado antes de copiar, tenga en cuenta que las declaraciones de importación están atenuadas o no (alguna indicación de IDE muestra que este nombre no se usa). si está atenuado significa que debe eliminar esos nombres, luego cópielos y péguelos en la matriz de importaciones y exportaciones de MaterialModule . eso es resolver

over 4 years ago · Santiago Trujillo Report

0

Estaba importando mat-list . Mi error fue usar lo siguiente:

 import { MatList } from "@angular/material/list"; @NgModule({ exports: [ MatList, ] })

Olvidé agregar el sufijo 'Módulo' a la declaración de importación y exportación. Lo siguiente solucionó el problema:

 import { MatListModule } from "@angular/material/list"; @NgModule({ exports: [ MatListModule, ] })
over 4 years ago · Santiago Trujillo Report

0

En mi caso, el problema fue llamar a .forRoot() desde algunos módulos secundarios que estaban destinados a ser reutilizados.

over 4 years ago · Santiago Trujillo Report

0

  1. App.Module.ts

    Puede solucionar el error agregando los inyectables en Proveedor no importaciones o declaraciones.

  2. Servicio interno.ts

    Agregue @injectable sobre la clase

ex:

 @Injectable() export class WebApiService { }

incluso si das espacio podría no funcionar

ex:

 @Injectable() export class WebApiService { }
over 4 years ago · Santiago Trujillo Report

0

puede ocurrir cuando importa un módulo que ya instaló, pero falta una o más de sus dependencias

over 4 years ago · Santiago Trujillo Report

0

En mi caso, el problema estaba en el último nodo. Estaba acoplando la aplicación Angular y usando la última versión del nodo como FROM node:latest as build

Para que funcione, use versiones de nodos compatibles con Angular como FROM node:14.17.4

over 4 years ago · Santiago Trujillo Report

0

Mi error: escribí

 import { MatPaginator } from '@angular/material/paginator';

en lugar de

 import { MatPaginatorModule } from '@angular/material/paginator';

en mi modulo.

over 4 years ago · Santiago Trujillo Report

0

intenta borrar el caché

  1. npm cache clean --force
  2. npm install
over 4 years ago · Santiago Trujillo Report

0

Si ejecuta npm install o yarn install con una cuenta raíz y ejecuta ng serve con una cuenta que no sea raíz, se encontrará con este problema.

Solución alternativa: inicie el servidor con la cuenta raíz también

over 4 years ago · Santiago Trujillo Report

0

Recibí este error al hacer una directiva compartida. Ahora, inicialmente entró en la matriz de declaraciones del módulo de la aplicación (de forma predeterminada después de ejecutar el comando con cli).

Lo tenía en la declarations array de exports array . Ahora, tan pronto como lo eliminé del archivo app.module.ts , el problema se resolvió.

El problema fue que se declaró dentro de 2 módulos (shared y app.module). Eliminado de app.module y listo!

over 4 years ago · Santiago Trujillo Report

0

Enfrenté un problema en Angular 12 y el problema es que mi colega definió el componente en el módulo de página y también el módulo común que usamos globalmente en el proyecto.

Eliminado del módulo de archivo global, problema resuelto.

On My Case

over 4 years ago · Santiago Trujillo Report

0

Estaba tratando de agregar una canalización personalizada a mi módulo compartido y lo agregué en la importación y exportación. Es por eso que causó este problema.

Resolví este problema agregando mi tubería personalizada en declaraciones: [], exportaciones: [] y proveedores: [].

Resolví este problema siguiendo el código:

 @NgModule({ declarations: [ myCustomPipe, ], exports: [ myCustomPipe, ], providers: [ myCustomPipe, ] })
over 4 years ago · Santiago Trujillo Report

0

No sé por qué, pero la única forma en que pude resolverlo fue:

  1. Importar el módulo en lugar del componente
  2. Haga coincidir el nombre de la carpeta /my-component-y/ con MyComponentY.ts, tenía /component-y/ y MyComponentY.ts

Los componentes raíz tienen carga diferida ya que es para un sitio múltiple si eso hace alguna diferencia.

La mejor solución es usar React/Next.js en lugar de este antiguo marco hacky.

over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!