Error TS2677: TypeScript build failure in Angular application on Azure DevOps pipeline

An error is occurring only during the Npm@1 task on the DevOps pipeline, while the app builds without issues locally. The Angular CLI version is 8.3.29 and TypeScript version is 3.5.3.

The custom command being executed is:

run build:artifact

This command points to the following in package.json:

ng build --configuration=artifact

The error message thrown is as follows:

../node_modules/@types/lodash/common/lang.d.ts:577:74 - error TS2677: A type predicate's type must be assignable to its parameter's type.

Full log from the pipeline:

Starting: Angular Build
==============================================================================
Task         : npm
Description  : Install and publish npm packages, or run an npm command. Supports npmjs.com and authenticated registries like Azure Artifacts.
Version      : 1.202.0
Author       : Microsoft Corporation
Help         : https://learn.microsoft.com/azure/devops/pipelines/tasks/package/npm
==============================================================================
C:\Windows\system32\cmd.exe /D /S /C "C:\hostedtoolcache\windows\node\14.15.0\x64\npm.cmd --version"
6.14.8
C:\Windows\system32\cmd.exe /D /S /C "C:\hostedtoolcache\windows\node\14.15.0\x64\npm.cmd config list"
... (omitted for brevity)
...

Do you know how to track down where this error is being triggered?

When running the same command [

ng build --configuration=artifact
] manually on a local dev box with matching node\npm versions, no errors occur.

...

Answer №1

There has been a recent update that caused an issue with the package. The problem is being monitored on their Github page, but for now it's recommended to revert back to the previous version of @types/lodash which is 4.14.182.

Answer №2

During the process of updating npm-check from version 5.9.0 to 6.0.1, I encountered the same error.

If you come across this specific error message:

/node_modules/@types/lodash/common/lang.d.ts:577:74 

It is likely caused by the @types/lodash package. To inspect the package's structure, use the following command:

npm list <package-name> npm list @types/lodash

The output displayed was as follows:

└─┬ [email protected] └─┬ [email protected] └── @types/[email protected]

This indicates that the issue stems from the update in npm-check version.

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

Setting up configuration for a singleton service within an Angular library

My goal is to offer a service in my Angular library for use in consumer applications using the provideIn: 'root' option. At the same time, I want to provide configuration options such as forRoot, forChild, or withConfig. Is there a way to accompl ...

Emulate an HTTP Observable response using a subject

In the realm of Angular 4, I have crafted a service that currently relies on an HTTP request to produce an Observable of type Comment. return this.http.post(targetUrl, JSON.stringify({ 'Text': comment.Text, 'ThreadId': threadId }), op ...

CombineLatest will persist even if one of the observables fails, thanks to its built-in pipe for catchError

I am striving to achieve a goal very similar to the scenario described in this question: Observable.combineLatest continue even if one fails The main distinction is that my service already includes a feature to handle error requests by returning a throwEr ...

Are Typescript generics that use "extends object" unnecessary? How should this be approached for best practices?

In my observations, using the <P extends object> generic in JavaScript is often deemed pointless since virtually everything in the language is an object. Most literals behave like objects with methods such as .toString, and strings are objects with p ...

The field 'password' is not found in the data type 'User | undefined'

Howdy everyone, I've encountered an issue stating "Property '_doc' does not exist on type 'User & { _id: ObjectId; }'" in one of my controller documents while trying to fetch a particular user. My backend database is implemented us ...

How can I transfer data between methods within Angular?

Help Needed: I have a service file with two methods, each having its own API. I want to call the getData method within the deleteData method. Can anyone guide me on how to achieve this? .service.file getData(): Promise<PagedResult<Sites>> { ...

When the Angular+gsap3 animation fails to trigger on click

app.component.html <div #animate class="main"> <div id="go" (click)="click()" class="box1"></div> <div class="box"></div> <div class="box"></di ...

Customizing table header sort icons in PrimeNG 15.4+: A step-by-step guide

The most recent update in PrimeNG brought about a change in the way sort icons are implemented. Previously, they used an i tag with CSS classes which could be customized easily using my company's icons: https://i.sstatic.net/f0Nrq.png However, the n ...

Guide on converting enums in Angular 6

I have been working on translating enums in Angular, but I'm facing a challenge. While I can read and display them in a dropdown menu, translating them is proving to be difficult. Here is an example of my code: export enum test { test1 = '1 - ...

Acquiring information from a Service and saving it in a Child component - Angular version 11

Utilizing my service, I fetch API data for the child component. Initially, it retrieves the Id and other user data, displaying it in the console. ngOnInit(): void { this.commonService.userSetChange.subscribe( apiData => { this.getUserS ...

Be sure to run tests before using the sonar-scanner command to accurately measure code coverage in Sonar

Currently, the project I am involved in has Sonar set up for code analysis. My team is interested in viewing the test coverage of the code while running the sonar-scanner. https://i.sstatic.net/3Mo5Q.png The project utilizes Angular framework and in orde ...

The entire space should be filled with the background

My goal is to achieve the following while addressing some current issues: The background is currently limited to affecting only the container. I want it to span the entire area. There needs to be space between the cards and padding inside them. https://i ...

retrieve a stream of data from a subscription

After conducting various experiments, I decided to share the code in its original form to determine the best practice: Within a function (in the service), I subscribe to a result as a BLOB and save it as content of a file on the local file system using Fil ...

The unit tests are not triggering the execution of setTimeout

Currently, I am developing a project in TypeScript and for unit-tests, I am utilizing QUnit and sinonjs. One of the functions within my code dynamically renders UI elements. I need to retrieve the width of these dynamic elements in order to perform additio ...

Update the response type for http.post function

I've implemented a post method using Angular's HttpClient. While attempting to subscribe to the response for additional tasks, I encountered the following error: Error: Uncaught (in promise): HttpErrorResponse: {"headers":{"normalizedNames":{}, ...

What is the process of integrating passportjs(node) API with the Angular cli?

After successfully configuring Node.js with PassportJS OAuth2, the need arose for Angular to call the Node API. However, they are running on different ports. While calling all of Node.js's REST APIs from Angular works fine using proxy.conf.json, an er ...

Is there a way to resolve the issue of retrieving the processed value directly in NestJS's @OnEvent function?

Due to excessive logic in the API and its slow performance, I have resorted to handling some of the logic with @OnEvent. The problem arises when the frontend runs the @GET API immediately after this API, potentially without waiting for @OnEvent to update. ...

Using StencilJS to Incorporate CSS/SASS Styles from node_modules

I'm currently facing a challenge in importing a CSS file containing variables from a node_modules package. Despite trying to replicate the process outlined in stencil.config.ts, the builds continue to end up in a different location than intended, leav ...

Tips for handling external .d.ts dependencies when releasing an NPM package

Currently, I am in the process of releasing a module on the NPM registry. This particular module has been developed using TypeScript and includes a typings attribute in the package.json file along with "declaration": true specified in the tsconfig.json. ...

How to pass a single property as a prop in TypeScript when working with React

I have a main component with a parent-child relationship and I am looking for a way to pass only the product name property as props to my "Title" component. This way, I can avoid having to iterate through the information in my child component. To better i ...