Problem with setting up and using libraries in Angular 10 installation

Currently, my Angular App is at version 10.4 and I am facing issues when trying to integrate libraries like ngx-dropzone, ngx-file-drag-drop, ng2pdf viewer, or any other library. These integrations are throwing errors during compilation.

Below are the specific errors:


    ERROR in node_modules/@iplab/ngx-file-upload/lib/services/file-upload.service.d.ts:14:21 - error TS2694: Namespace ""C:/Users/USER/Desktop/medic-cms/Medic-CMS/node_modules/@angular/core/core"" has no exported member 'ɵɵFactoryDeclaration'.

14     static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadService, never>;
                       ~~~~~~~~~~~~~~~~~~~~
node_modules/@iplab/ngx-file-upload/lib/services/file-upload.service.d.ts:15:22 - error TS2694: Namespace ""C:/Users/USER/Desktop/medic-cms/Medic-CMS/node_modules/@angular/core/core"" has no exported member 'ɵɵInjectableDeclaration'.

15     static ɵprov: i0.ɵɵInjectableDeclaration<FileUploadService>;
                        ~~~~~~~~~~~~~~~~~~~~~~~
node_modules/@iplab/ngx-file-upload/lib/components/file-upload-abstract.component.d.ts:30:21 - error TS2694: Namespace ""C:/Users/USER/Desktop/medic-cms/Medic-CMS/node_modules/@angular/core/core"" has no exported member 'ɵɵFactoryDeclaration'.

30     static ɵfac: i0.ɵɵFactoryDeclaration<FileUploadAbstract, never>;
                       ~~~~~~~~~~~~~~~~~~~~
node_modules/@iplab/ngx-file-upload/lib/components/file-upload-abstract.component.d.ts:31:21 - error TS2694: Namespace ""C:/Users/USER/Desktop/medic-cms/Medic-CMS/node_modules/@angular/core/core"" has no exported member 'ɵɵDirectiveDeclaration'.

Currently, I am unable to upgrade my angular version for resolving these integration errors.

angulartypescriptangular-library

Answer №1

Ensure to obtain previous iterations of the libraries as they are not harmonious with your Angular version 10.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Determining the modified field in an Angular 2 formbuilder

Is there a way to determine which field has been changed in an Angular2 form builder? I want to include some logic that triggers if field 'a' is changed, and another set of actions if field 'b' is changed. this.comparisonForm = this.fo ...

angular

Angular Material Datepicker DateCustomizer

Is there a way to manually update the dateClass within a function? datepicker HTML <mat-datepicker [dateClass]="dateClass" #picker fxLayoutAlign="start start" (opened)="appendFooter()" > </mat-dat ...

angularangular-material

Managing sessions within a Spring OAuth2 client acting as a gateway for secure communication

While developing a microservices application, I encountered an authentication issue that was addressed in a similar way to @ch4mp's suggestion in their tutorial on . In my case, the oauth2Client serves as both an authentication gateway and a gateway, ...

javaangularspring-cloud-gatewayspring-authorization-serverspring-boot-starter-oauth2-client

Error message stating: "Identifier not defined in Angular 6 ngFor"

Having some trouble with Google's YouTube API. While I'm able to retrieve the data successfully, I'm struggling to display it in a meaningful way. Using a service for the API call, here's the code. My goal is to showcase specific result ...

htmlnode.jsangulartypescript

I am unable to display the service response in the Angular component

I'm facing an issue with displaying data in an angular component from a service. The process from the service to the component seems fine, but when I try to use the variable in HTML, it doesn't show the result. For this project, I am using the M ...

javascripthtmlangulartypescriptmetronic

Accessing Promise.all in the rejection function is not allowed

I have a service that retrieves data, and I make 5 calls to it with different parameters to retrieve various datasets. When the function is successful, everything works fine. However, in case of failure for any of the 5 calls, I need to handle it differen ...

javascriptangularionic-frameworkpromiseionic2

Is there a way to reset my form following a successful ngrx action?

I am working with a reactive form implementation: const generateFormGroup = (dataItem?: User) => { if (dataItem) { return new FormGroup({ id: new FormControl(dataItem.id), name: new FormControl(dataItem.name), city: new FormCont ...

angularngrx

Functionality not working due to a separate function not being called properly in Angular 7

I am struggling to trigger a separate function when invoking a function within a service. Below is a straightforward example foo() { this.bar(); console.log('foo'); } bar() { console.log('bar'); } Upon running my code, &a ...

angular

Why does IntelliJ IDEA 2016 show an error for using the [ngSwitch] attribute in this Angular2 template?

Every time I run precommit inspections, I receive a barrage of warnings even though everything seems to be functioning properly. The warnings include: Warning:(8, 58) Attribute [ngSwitch] is not allowed here Warning:(9, 42) Attribute [attr.for] is not all ...

javascriptintellij-ideaangular

Adding a constant to a Vue component

Currently working on developing an application using Vue and TypeScript. I'm focused on refactoring some aspects, particularly moving hard-coded strings from a template to a separate constant. What has been implemented is as follows: export const va ...

typescriptvue.js

What are the compatibility considerations for npm packages with Angular 2? How can I determine which packages will be supported?

When working with Angular 2, do NPM packages need to be modified for compatibility or can any existing package work seamlessly? If there are compatibility issues, how can one determine which packages will work? For instance, let's consider importing ...

javascripttypescriptnpmecmascript-6commonjs

Guide for communicating with parent attribute directive from child component in Angular 7

I am aiming to create a custom directive that can listen for a DOM event within its scope, and handle that event. The catch is that the DOM event will be triggered in a third-party component that I do not have control over. In Angular, I have defined the ...

javascriptangulartypescriptckeditor

Tips on enabling click function in an ionic infowindow

After creating a div in my HTML file and referencing it in my TS file using document.getElementByID, I utilized its inner HTML as the content for an infowindow. However, despite my efforts, I am unable to get clicks working. Adding event listeners to any e ...

typescriptgoogle-mapsionic3

Tips for Modifying the currentUrl identifier in Angular 2

I am trying to change the ID property of my currentUrl object within my component. My goal is for the ID to update and then fetch the corresponding data based on that ID. However, I keep encountering this error message: "Cannot assign to read only propert ...

javascriptangulartypescript

Fetching DataItem from a Kendo Grid using a custom button in an Angular application

I have been working on transferring the dataItem from a Kendo grid to an Angular 6 component. Here is my setup: <kendo-grid [data]="view | async" [height]="533" (dataStateChange)="onStateChange($event)" (edit)="editHandler($even ...

angularkendo-uikendo-griddataitem

.NET Core backend experiences file becoming null during Angular multipart upload

I am having some issues while attempting to upload a basic file to my backend dotnet core application. The problem is that the file ends up being null, whereas the description is not. This is my .NET Core controller: [AllowAnonymous] [HttpPost] [Route("u ...

angulartypescript.net-core

Having trouble importing TransitionProps from the most recent MUI version

I'm having an issue with material ui "@material-ui/core": "^4.11.3". I am trying to import the TypeScript interface TransitionProps, but my eslint is showing an error that it cannot resolve the path. My code is identical to the one ...

typescriptmaterial-ui

Difference between Angular2 import syntax: "use 'import * as <foo>'" or "use 'import {<foo>}'"

There are two different ways to import modules that I have noticed. Most imports seem to follow this syntax: 'import {<something>} (for example, import { Component } from '@angular/core';) The other way of importing looks like this: ...

javascriptangularimporttypescript-typingsangular2-injection

Initial value not being recognized by mat-input attribute disable

My current challenge involves toggling the enable/disable status of mat-inputs based on a specific property value within an object. Within my component, I am subscribing to an observable in my service that retrieves applications with a default disabled fl ...

angularattributesdisabled-input

common problems during initial setup of AngularJS 2

My background is in PHP and JavaScript, and I have limited experience with nodejs and angular js. While attempting to learn angular js 2, I encountered difficulties setting up my first example. I am using node v 5.6.0 and npm version 3.7.2 on ubuntu 14. ...

typescriptgulpangulartsd